Невозможно создать ссылку в реагировать родной - PullRequest
Новая
       13

Невозможно создать ссылку в реагировать родной

0 голосов
/ 14 февраля 2019

Я хочу установить фокус на следующие TextInput, используя createRef().Я получаю ошибку в createRef().Что я делаю неправильно?Заранее спасибо. 

constructor(props) {
        super(props);
            this.r2Ref = React.createRef();
            this.r3Ref = React.createRef();
            this.r4Ref = React.createRef();
            this.r5Ref = React.createRef();
    }

render() {
        return (
            <View style={SetStyle.settingsCont}>
            <ScrollView>

                <View style={SetStyle.contRate}>

                    <View style={SetStyle.rView}>
                        <Text style={SetStyle.rText}>Rate1</Text>
                        <TextInput style={SetStyle.rInput} keyboardType='numeric'
                            returnKeyType="next" onSubmitEditing={() => this.refs.r2Ref.focus()}></TextInput>
                    </View>
                    <View style={SetStyle.rView}>
                        <Text style={SetStyle.rText}>Rate2</Text>
                        <TextInput style={SetStyle.rInput} keyboardType='numeric'
                            ref={r2Ref => this.r2Ref = r2Ref}
                            returnKeyType="next" onSubimitEditing={() => this.refs.r3Ref.focus()}></TextInput>
                    </View>
                    <View style={SetStyle.rView}>
                        <Text style={SetStyle.rText}>Rate3</Text>
                        <TextInput style={SetStyle.rInput} keyboardType='numeric'
                        ref={r3Ref => this.r3Ref = r3Ref}
                        returnKeyType="next" onSubmitEditing={() => this.refs.r4Ref.focus()}></TextInput>
                    </View>
                    <View style={SetStyle.rView}>
                        <Text style={SetStyle.rText}>Rate4</Text>
                        <TextInput style={SetStyle.rInput} keyboardType='numeric'
                            ref={r4Ref => this.r4Ref = r4Ref}
                            returnKeyType="next" onSubmitEditing={() => this.refs.r5Ref.focus()}></TextInput>
                    </View>
                    <View style={SetStyle.rView}>
                        <Text style={SetStyle.rText}>Rate5</Text>
                        <TextInput style={SetStyle.rInput} keyboardType='numeric'
                            ref={r5Ref => this.r5Ref = r5Ref}></TextInput>
                    </View>
                </View>

            </ScrollView>
            </View>
        );
    }
}

Я получаю следующую ошибку:

Undefined не является объектом (оценка this2.refs.r2Refs.focus)

Ответы [ 3 ]

0 голосов
/ 15 февраля 2019

Я решил проблему, удалив createRef () из конструктора и удалив ref из onSubmitEditing

Затем я написал следующее: 

<TextInput ref={r2Ref => this.r2Ref = r2Ref}></TextInput>

и использовал егоследующим образом: 

<TextInput onSubmitEditing={() => this.r2Ref.focus()}></TextInput>
0 голосов
/ 02 мая 2019

// Инициализация
this.fieldOne = React.createRef (); 

<TextInput style = {styles.input}
               underlineColorAndroid = "transparent"
               placeholder = "Email"
               ref={this.fieldOne}
               onChangeText = {this.xxxxx} />

// Чтобы установить фокус this.fieldOne.current.focus ();

вышекод работает для меня.Надеюсь, это кому-нибудь поможет

0 голосов
/ 14 февраля 2019

Проблема здесь в том, что вы смешиваете Callback Refs с createRef API.Также вы обращаетесь к ним неправильно.После того, как вы определили их как переменные, вам нужно использовать вместо них указанные переменные.

Что вам нужно сделать, это что-то вроде: 

class Component extends React.Component {
  r2Ref = React.createRef();

  render() {
    return <Input name="r2" ref={this.r2Ref} />
  }
}
...