将多个状态值传递给reactjs中的子组件

时间:2017-04-04 11:21:21

标签: reactjs

我尝试将两个州元素作为道具发送,我需要将列表菜单作为一个var发送。

我的 getInitialState 功能就像;

getInitialState:function(){
    return{
      list:['Breakfast: 9.00', 'Lunch: 12.00', 'Dinner: 18.00'],
      menu:['Kahvaltılık Sebzeli Sucuk, Soslu Zeytin, PeynirBal', 'Tel şehriyeli Çorba, Patates Kızartması, Uzun Makarna, Renkli Salata (tarifimdeki)', 'Patatesli Sigara Böreği, Mercimek köftesi, Elmalı Kurabiye']
    }
  }

var 是;

var list = this.state.list;
list = list.map(function(item, index){
  return(
    <ListItem item={item} key={index} onClick={this.handleVisibility}/>
  );
}.bind(this));

我试着这样做;

var list = this.state.list;
list = list.map(function(item, index){
  return(
    <ListItem item={item} menu={this.state.menu} key={index} onClick={this.handleVisibility}/>
  );
}.bind(this));

我也试过这个但没有工作;

var menu = this.state.menu;
var list = this.state.list;
list = list.map(function(item, index, menu){
  return(
    <ListItem item={item} menu={menu} key={index} onClick={this.handleVisibility}/>
  );
}.bind(this));

但它返回未定义

1 个答案:

答案 0 :(得分:0)

像这样写:

<ListItem list = {this.state.list} menu={this.state.menu} onClick={this.handleVisibility}/>

现在ListItem您可以this.props.listthis.props.menu访问它们。

<强>更新

var list = this.state.list;
list = list.map((item, index) => {
    return(
        <ListItem item={item} menu={this.state.menu} key={index} onClick={this.handleVisibility.bind(this)}/>
    );
});
相关问题