如何使用React Native中的导航器动态地向组件添加新道具

时间:2015-11-05 04:44:46

标签: javascript jquery reactjs react-native

在我的场景中,我使用导航器渲染组件。在该组件中,我执行了一些操作,例如保存记录,然后我动态地向现有组件添加了一个新的prop。但是这里的动态道具在该组件中是不可见的,只有之前的道具才可见。如何使用导航器为组件添加动态道具。

这里我在使用React Native导航器时提供代码我正在调用DisplayCustomSchema组件,如下所示

this.props.navigator.push({
     id: 'DisplayCustomSchema',
     name: 'DisplayCustomSchema',
     org:this.props.org
});

在DisplayCustomSchema组件componentDidMount中我调用了一个ajax,它会返回一些数据。

var DisplayCustomSchema = React.createClass({

         componentDidMount : function(){
             ajaxpost(data){//example only
               this.props.record=data
              //here i am try to move response data to props because I am using this data in saveRecord function but in save record props contain name and org only


       }
      }
      render: function(){
                <View>
                  <TouchableHighlight style={styles.touchButtonBorder} underlayColor="#ffa456" onPress={saveRecord.bind(this,this.props)}>
                    <Text style={styles.button}>SAVE</Text>
                  </TouchableHighlight>
                </View>
      }
})

这里我的问题是为什么数据不会移动到道具

1 个答案:

答案 0 :(得分:1)

您有两个选择

  1. 使用state
  2. 使用redux

    等框架
    1. 由于您无法设置道具,您可以使用this.setState设置加载的数据

    2. 如果您使用redux,您可以在安装时调度操作,然后更改商店以包含已加载的道具。

  3. 请注意,强烈建议使用第二个选项,因为使用state是反模式。