React native 无法使用react native将值动态分配给TextInput

在我的场景中，当关注TextInput时，我正在使用导航器（使用推送）移动到另一个场景，在那里我填充列表，在该列表中选择一个值，该值应填充到TextInput的前一个场景。在这种情况下，我无法将所选值设置为TextInput的前一个场景

我的代码结构是

var FirstComponent = React.createClass({
     render:function(){
             return(<TextInput value="" placeholder="Enter value" onFocus={getData.bind(this)} />)
      }
})

function getData(ev){
var target = ev;
      this.props.navigator.push({
          id:'SecondComponent',
          name:'SecondComponent',
          target:target, 
       })
}
var SecondComponent = React.createClass({
        render:function(){
               return(<TouchableHighlight onPress={fillData.bind(this,target, self.props.navigator,selectedText)}><Text>sample</Text></TouchableHighlight>)
        }
});
function fillData(rootThis,nav,selectedText,ev){

     rootThis.value=selectedText;
     rootThis.nativeEvent.target = selectedText;
     rootThis.nativeEvent.target .text= selectedText; // Here ' rootThis ' is route object 'this'

//how to fill selectedText in FirstComponent TextInput value
}

var FirstComponent=React.createClass({
render:function（）{
返回（）
}
})
函数getData（ev）{
var目标=ev；
这个是.props.navigator.push({
id:'SecondComponent'，
名称：'SecondComponent'，
目标:目标,，
})
}
var SecondComponent=React.createClass({
render:function（）{
退货（样品）
}
});
函数fillData（rootThis、nav、selectedText、ev）{
rootThis.value=selectedText；
rootThis.nativeEvent.target=selectedText；
rootThis.nativeEvent.target.text=selectedText；//此处的“rootThis”是路由对象“this”
//如何在FirstComponent文本输入值中填充selectedText
}

首先，如果只是传递从组件返回的默认属性，则不需要再使用bind

无论如何，我会这样做：

first_component.js:


var FirstComponent = React.createClass({
  getInitialState: function() {
    value: ""
  },

  render:function(){
    return(
      <TextInput value={this.state.value} placeholder="Enter value" onFocus={this.moveToSecondComponent} >
    );
  },

  moveToSecondComponent: function() {
    this.props.navigator.push({
      component: SecondComponent
      onSelect: this.popBackAndUpdate // This assumes you are using Navigator. If you are using NavigatorIOS, just wrap it in 'passprops'
    })
  },

  popBackAndUpdate: function(value) {
    this.setState({value: value});
    this.props.navigator.pop();
  }

});


second_component.js:
var SecondComponent = React.createClass({
  render: function() {
    return(
      <TouchableHighlight onPress={() => { this.props.route.onSelect("new value")}}>
        <Text>sample</Text>
      </TouchableHighlight>)
  }
});

first_component.js:
var FirstComponent=React.createClass({
getInitialState:函数（）{
值：“”
},
render:function（）{
返回(
);
},
moveToSecondComponent:function（）{
这个是.props.navigator.push({
组件：第二个组件
onSelect:this.popBackAndUpdate//这假设您使用的是Navigator。如果您使用的是NavigatorIOS，只需将其包装为“passprops”
})
},
popBackAndUpdate:函数（值）{
this.setState（{value:value}）；
this.props.navigator.pop（）；
}
});
第二个_component.js：
var SecondComponent=React.createClass({
render:function（）{
返回(
{this.props.route.onSelect（“新值”）}>
样品
)
}
});

这个要点是，在第二个组件中，您只需将新值传递给回调函数，它就会弹出导航器

---

希望对您有所帮助。

thnks eyal83。就我而言，Popback和Update函数不在该组件的范围内。如何获取第一个组件？对不起，我不理解这个问题。你能解释一下吗？好的。我如何在组件外面定义popBackAndUpdate函数。你可能不想这么做。您应该在组件中保留一个真正“面向反应”的函数。您希望您的“this”清楚地表明它是React组件。如果您需要在多个地方重用它，您可以创建一个mixin并将其包含在不同的组件中。在我的情况下，mixin（因为我是reactnative新手）不适合。无法在组件外定义popBackAndUpdate函数。