Reactjs 如何在反应型本机平面列表的textinput中更改焦点？

我有一个调用renderItem方法的平面列表，这个方法返回一个包含TextInput的组件。我希望设置textinputs的onSubmitEditing方法，以便将焦点设置在下一个输入上

平面列表：

<FlatList
  data={this.state.itens}
  keyExtractor={(i) => `${i.IdBalancoItem}`}
  renderItem={this.renderItem}
/>

`${i.IdBalancoItem}`}
renderItem={this.renderItem}
/>

renderItem：

renderItem = (ItemBalanco) => {
    const { item, index } = ItemBalanco;
    return (
      <View
        style={{
          flexDirection: 'row',
          borderColor: '#aaa',
          borderRadius: 5,
          borderWidth: 1,
          padding: 5,
          marginBottom: 1,
        }}>
        
          <View>
            <Input
              returnKeyType={
                this.state.itens.length - 1 === index ? 'done' : 'next'
              }
              keyboardType="number-pad"
              value={item.Quantidade}
              onChangeText={(e) => this.alteraQuantidadeItem(index, e)}
            />
          </View>
      </View>
    );
  };

renderItem=（ItemBalanco）=>{
常量{item，index}=ItemBalanco；
返回(
this.alteraQuantidadeItem（index，e）}
/>
);
};

找到了解决方案

我需要在我的输入组件中添加hook

forwardRef

，如下所示：

import React, { forwardRef } from 'react';
import { TextInput } from 'react-native-paper';

const Input = (props, ref) => {// NOW RECEIVE THE REF HERE
  const {
    onChangeText,
    onSubmitEditing,
    value,
    placeholder,
    secureTextEntry,
    label,
    showSoftInputOnFocus = true,
    returnKeyType,
  } = props;

  return (
    <TextInput
      {...props}
      dense={true}
      label={label}
      mode="outlined"
      ref={ref}// SET THE REF HERE
      secureTextEntry={secureTextEntry}
      placeholder={placeholder}
      value={`${value ?? ''}`}
      onChangeText={(val) => {
        onChangeText(val);
      }}
      returnKeyType={returnKeyType}
      showSoftInputOnFocus={showSoftInputOnFocus}
      onSubmitEditing={onSubmitEditing}
      autoCapitalize="none"
      autoCorrect={false}
      theme={{
        colors: {
          placeholder: '#111',
          text: '#111',
          primary: '#034885',
          underlineColor: 'transparent',
          background: '#f2f2f2',
        },
      }}
    />
  );
};

const forwarded = forwardRef(Input);//USE THE HOOK HERE

export default forwarded;

<Input
    returnKeyType={
        this.state.itens.length - 1 === index ? 'done' : 'next'
    }
    ref={(r) => (this.referencias[index] = r)} //<---- THIS LINE, REFERENCIAS IS AN ARRAY OF REFS
    onSubmitEditing={(e) => this._mudafoco(index)}
    keyboardType="number-pad"
    value={item.Quantidade}
    onChangeText={(e) => this.alteraQuantidadeItem(index, e)}

_mudafoco(index) {
    //checks if it's not the last item of the array to change focus
    if (index !== this.state.itens.length - 1) {
      let i = index + 1;
      this.referencias[i].focus();
      return;
    }
    //else it's the last item of array and I can call another method
    this.handleProximo();
  }

---

请提供您的代码。好了。this.state.itens是一个iten的dinamic数组，我一直试图在输入上添加一个ref，这样我就可以改变焦点，但没有成功。