如何獲取NavigatorIOS的子組件TextInput的反應原生的值

我有一個包含設置視圖的NavigatorIOS組件。在該設置視圖中是一個設置列表，單擊打開它們自己的視圖。當點擊該設置，向後箭頭和右按鈕出現，就像這樣：如何獲取NavigatorIOS的子組件TextInput的反應原生的值

我有當按下右邊的按鈕稱爲onRightButtonPress的功能集是我的導航器的push功能，這是一種內從設置頁面調用以將設置頁面綁定到子項。我push功能如下：

navHeight(){ 
    this.props.navigator.push({ 
     title: 'Height', 
     component: Height, 

     rightButtonTitle: 'Save', 
     passProps: { 
      units: this.state.units 
     }, 
     onRightButtonPress:() => { 
      console.warn("hey whats up hello"); 
      this.props.navigator.pop()} 
     }) 
    }

認爲呈現的是一個孩子的身高組件看起來是這樣的：

class Height extends Component{ 
    render(){ 
    return(
     <View style={styles.settingInput}> 
     <Text style={styles.inputRow}>Height: </Text> 
      <TextInput ref="heightInput" 
     onChangeText={function(text){ 
      console.warn(text); 
     } 
     }/> 
      <Text style={styles.inputRowRight}> m</Text> 
     </View> 
    );  
    } 
}

有沒有什麼辦法的時候訪問TextInput的價值在Height組件onRightButtonPress叫做？如果有幫助，我的反應原生版本是0.27.2。

編輯：我特別只想訪問按下保存按鈕時寫入TextInput內部的文本。基本上，我不希望任何傳遞給孩子的道具被更新，除非它被按下。

來源

2016-06-10 zavtra

你可以將'onRightButtonPress.bind（this）'傳遞給_Height_，所以你可以像'onChangeText = {function（text）{this.props.onRightButtonPress（text）;}}'' – Siou

那樣使用它哦，但是我特別需要在按下rightButton之前不要調用onRightButtonPress。每次更改文本時都會調用onRightButtonPress。 – zavtra

爲了澄清，我從來沒有使用react-native，只是reactjs。

也許你可以直接將一個函數傳遞給道具，並將其作爲TextInput組件的onChangueText的回調函數。

const externalGetInputText() => return this.refs.heightInput.value; 


navHeight() { 
    this.props.navigator.push({ 
     title: 'Height', 
     component: Height, 

     rightButtonTitle: 'Save', 
     passProps: { 
      units: this.state.units, 
      internalGetInputText: externalGetInputText 
     }, 
     onRightButtonPress:() => { 
      console.warn("hey whats up hello"); 
      const text = externalGetInputText(); 
      console.warn(text); 
      this.props.navigator.pop()} 
    }) 
} 

class Height extends Component{ 
    render(){ 
     return(
      <View style={styles.settingInput}> 
       <Text style={styles.inputRow}>Height: </Text> 
       <TextInput 
        ref="heightInput" 
        onChangeText={this.props.internalGetInputText} 
       /> 
       <Text style={styles.inputRowRight}> m</Text> 
      </View> 
     ); 
    } 
}

最後一點，我沒有測試它。

來源

2016-06-11 00:15:13

它似乎沒有讓我在一個類之外聲明externalGetInputText。我創建了一個名爲cachedHeight的全局變量，其中'onPress'更新並在調用'onRightButtonPress'時保存。這是一個拙劣的解決方案，我不以此爲榮。 – zavtra

如果你找出一個更好的方法，讓我知道=） –

會做。我覺得「綁定」可以像Siou的評論中指出的那樣，而不是像他這樣做。 – zavtra

如何獲取NavigatorIOS的子組件TextInput的反應原生的值

回答

相關問題