es6写的react compoment 能在react-native里面复用吗?
比如chart.js
import React from 'react';
import ReactHighcharts from 'react-highcharts';
export default class Chart extends React.Component {
render() {
let config={
title:{text:'browser'},
series: [{
type: 'pie',
name: 'SLICE',
data: [
['Safari', 8.5],
['Opera', 6.2]
]
}]
};
return <RactHighcharts config={config} ref="chart"></RactHighcharts>;
}
}
这个图表在 浏览器环境正常能运行 如果放到 react-navite环境里 index.android.js
import React, {
AppRegistry,
Component,
StyleSheet,
Text,
View
} from 'react-native';
import Chart from './chart.js';
class AwesomeProject extends Component {
render() {
return (
<View style={styles.container}>
<Chart style={styles.welcome} />
<Text style={styles.instructions}>
Shake or press menu button for dev menu
</Text>
</View>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
backgroundColor: '#F5FCFF',
},
welcome: {
fontSize: 20,
textAlign: 'center',
margin: 10,
},
instructions: {
textAlign: 'center',
color: 'red',
marginBottom: 5,
},
});
AppRegistry.registerComponent('AwesomeProject', () => AwesomeProject);
手机报错 Expected a compoment class ,got div 查了一下react-native的文档,好象 div要转成View p要转换成 Text 那这样,不能直接复用啊,同样的内容,电脑和手机端要写两套标签
1 回复
react-highcharts是react的组件吧, 你写React-Native app 当然要用React-Native的那一套写的组件撒