如何控制React Native的<TextInput>的defaultValue？

Question

我有<TextInput/>一个defaultValue设置和一个按钮，它会引发和传递defaultValue的<TextInput>其他地方。

但是，我怎么在传递<TextInput/>的defaultValue到onPress的方法<TouchableHighlight/>？

这是我要实现的目标：

changeName(text) {
    this.setState({nameNow: text}) //How can I immediately set the defaultValue='PassMeIn' to nameNow? Because this method would never be called unless text is changed within TextInput
}

sendOff() {
    //Would like to access the defaultValue='PassMeIn' here whenever sendOff() is called. How can I?
}

render() {

    return (
      <View>
            <TextInput 
                defaultValue='PassMeIn' 
                onChange={this.changeName} 
                value={this.state.nameNow}
            />
            <TouchableHighlight onPress={this.sendOff}/>
                <Text>Button</Text>
            </TouchableHighlight>
      </View>
    )
}

Answer 1

一方面，该render方法不能返回多个节点。我认为<TextInput/>应该由<TouchableHighlight/>组件包装，例如：

render() {

  return (
    <TouchableHighlight onPress={this.sendOff}>
      <TextInput 
        defaultValue='PassMeIn' 
        onChange={this.changeName} 
        value={this.state.nameNow}
      />
    </TouchableHighlight>    
  )
}

这将使该国能够通过从传递一个道具<TouchableHightlight>来<TextInput为使用defaultValue，你将有机会获得它的<TouchableHighlight>组成部分。

Answer 2

您可以将 defaultValue 存储在新状态中，然后您可以在两个地方访问它

constructor(props) {
 super(props);
 this.state = {
  //...other state
  defaultValue: "PassMeIn"
 };

//...other code

sendOff() {
  //...do things with this.state.defaultValue
}

render() {

  return (
    <TextInput 
        defaultValue={this.state.defaultValue} 
        onChange={this.changeName} 
        value={this.state.nameNow}
    />
    <TouchableHighlight onPress={this.sendOff}/>
)
}