首页 > 在React Native的render方法中,如何动态的输出Component?

在React Native的render方法中,如何动态的输出Component?

这是我的一系列疑问,比如:在render()方法中如何通过js的循环体动态地输出渲染N个<View>? 比如我想输出:

<View>123</View>
<View>123<View>
<View>123<View>

换句话说:能否通过拼接字面量,进行模版渲染?不知道我说明白没

注:由于特殊场景不能使用ListView


react-router


不确定你说的拼接字面量是什么意思,我的理解是一个todo list的例子。
假设你的component是一个todo list, props.list = ['待办事项1', '待办事项2', '待办事项3'];
用js 的 map 方法就可以动态输出每个item。如下:

class TodoList extends React.Component{
  constructor(props){
    super(props);
  }
  renderList(list){
    return list.map( item => this.renderItem(item) );
  }

  renderItem(item) {
    return (
           <View>{item}</View>
       );
  }
  render(){
    const { list } = this.props;
    return <View>
      {this.renderList(list)}
    </View>
  }
}

并没有测试这段代码,欢迎讨论。

【热门文章】
【热门文章】