注意：以下文档只适用于TOP接口，请谨慎使用！
注意：以下文档只适用于TOP接口，请谨慎使用！
React的UI显示都是由数据驱动UI，所以当需要改变UI的显示时，应该改变的是组件的state，而不应该直接操作DOM，这跟传统的JQuery是很不一样的。
下边的例子就是一个根据数据显示的内容，把需要按照数据控制显示的内容放在函数里。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 | class MyClass extends Component { state={ showContent: false } //把需要控制显示的内容剥离开到函数 renderContent() { if(this.state.showContent){ return <Text>这是内容</Text> } } render() { return (<View> {this.renderContent()} </View>); }} |
有时可能需要渲染一个数组里的数据，比较好的办法就是把JSX放到一个数组里，然后再返回，以下是例子：
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 | class MyClass extends Component { state={ data: [1,2,3,4,5] } //这里渲染了一个数组的内容并进行返回。 renderArray(data) { var jsx = []; data.map((item, index)=> { jsx.push(<Text>item</Text>) } return jsx; } render() { return (<View> {this.renderArray(this.state.data)} </View>); }} |
###
