React native 每次击键后TextInput都会失去焦点

我有以下代码（完整示例）：

import React，{useState，useffect}来自“React”；
从“react native”导入{SafeAreaView，View，TextInput，Button，StyleSheet}；
常量应用=（）=>{
const[textblocks，setTextblocks]=useState（[]）；
const CreateTextBlockHandler=（）=>{
让数组=[…文本块]；
array.push（{text:'}）；
setTextblocks（数组）；
};
const SaveTextHandler=（索引，文本）=>{
让数组=[…文本块]；
数组[索引]。文本=文本；
setTextblocks（数组）；
};
常量RenderTextInputs=（）=>{
返回textblocks.map（（项目，索引）=>{
返回(
SaveTextHandler（索引，值）}/>
);
});
};
返回(
);
};
const styles=StyleSheet.create({
全员：{
弹性：1，
对齐项目：“居中”，
为内容辩护：“中心”
},
文本输入：{
宽度：200，
差额：10，
边框宽度：1，
边框颜色：“黑色”
}
});
导出默认应用程序；

工作原理：我有一个按钮可以动态添加一个新的文本输入。这很有效。问题是，对于我在文本输出中输入的每个字符，每个字符后焦点都会丢失

我创建了一个零食，你可以在这里测试它：

我想我需要将对textinput的引用保存在某个地方，然后在每次击键后将焦点返回到textinput，但我不知道如何做。

更改

return (
    <SafeAreaView style={styles.pancontainer}>
      <RenderTextInputs />
      <Button title="Create textblock" onPress={CreateTextBlockHandler} />
    </SafeAreaView>
  );

返回(
);

到

返回(
{RenderTextInputs（）}
);

或者将

RenderTextInputs

置于

App

外部，并通过道具传递数据。第一个语法react将

renderExtInputs

视为一个组件，并将其嵌套在

App

中，在每个App render上再次装载

return (
    <SafeAreaView style={styles.pancontainer}>
      <RenderTextInputs />
      <Button title="Create textblock" onPress={CreateTextBlockHandler} />
    </SafeAreaView>
  );

return (
    <SafeAreaView style={styles.pancontainer}>
      {RenderTextInputs()}
      <Button title="Create textblock" onPress={CreateTextBlockHandler} />
    </SafeAreaView>
  );