CODEWITHSUNDEEP
react-nativeref
DCR
DCR

Reputation: 15685

unable to access component with ref

Why is this.workmin.value undefined?

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>
    )
  }

Upvotes: 0

Views: 55

Answers (1)

Roy Wang
Roy Wang

Reputation: 11260

refs is deprecated, do this instead:

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

Then you can use it like this.workmin.focus().

Upvotes: 1

Related Questions