无法使用ref访问组件

时间:2018-04-29 19:30:29

标签: react-native ref

为什么this.workmin.value未定义?

captureInput=(text)=>{
    console.log('captureinput',this.refs.workmin.value)
  }

  render() {
    console.log('RENDER',this.state)


    return (
      <View style={styles.container}>
        <Text style={styles.bigFont}>{`${this.state.timer + 'TIMER'}`}</Text>
        <Text style={styles.bigFont}>{`${this.state.min + ':' + this.state.sec}`}</Text>
        <View style={styles.button}>
          <Button title='START' onPress={()=>this.startToggle()} />
          <Button title='RESET' onPress={()=>this.resetToggle()} />
        </View>
             <View style={styles.row}>
                <Text style={[styles.bold,{marginRight:10},{width:112},
                            {textAlign:'right'}]}>
                            Work Timer:</Text>
                <Text style={styles.bold}> min:</Text>
                <TextInput
                   
                   value={Math.floor(this.state.workTime / 60).toString()}
                   ref= {(ref)=>{this.workmin=ref}}
                   style={styles.input}
                   onChangeText={(text) => {this.captureInput(text)}}

                />
      </View>
    )
  }

1 个答案:

答案 0 :(得分:1)

不推荐使用

refs,请改为执行此操作:

<TextInput
  ref={(ref) => {
    this.workmin = ref;
  }}
/>

然后您可以像this.workmin.focus()一样使用它。