代码之家  ›  专栏  ›  技术社区  ›  arnoapp

React Native:访问另一个类中的TextField值

  •  0
  • arnoapp  · 技术社区  · 7 年前

    我在不同的类中有两个组件:

    TextInput

    class A extends Component<Props>{
        state = {
            textFieldValue: ""
        };  
        render() {
            return (
                <View>
                    <TextInput placeholder={this.props.placeholderText}
                                ref={textField => {
                                    this.textField = textField;
                                }}
                                value={this.state.textFieldValue}
                                onChange={e => this.setState({ textFieldValue: e.target.value})}/>
                </View>
            );}
    }
    

    组件B在其视图中使用A

    class B extends Component<Props>{
            render() {
                return (
                    <View>
                       <A placeholder={"test"}/>
                       <TouchableOpacity onPress={() => {
                                    //show text of input A here
                                }}>
                            <View>
                                <Text>{text}</Text>
                            </View>
                        </TouchableOpacity>
                    </View>
                );}
        }
    

    如何使用文本输入的值访问值/状态 A B

    0 回复  |  直到 7 年前
        1
  •  1
  •   Mervzs    7 年前

    在B级试试这个

        class B extends Component<Props>{
      render() {
          return (
              <View>
                 <A placeholder={"test"} ref={c => this.textRef = c}/>
                 <TouchableOpacity onPress={() => {
                              //show text of input A here
                              alert(this.textRef.state.textFieldValue)
                          }}>
                      <View>
                          <Text>{text}</Text>
                      </View>
                  </TouchableOpacity>
              </View>
          );}
    }