React Native 更新 JSON 个对象的数组 onChangeText,索引未定义
React Native Updating an Array of JSON objects onChangeText, index undefined
我有一个 useState 变量,它有一个 JSON 对象数组,我正在尝试让文本字段动态呈现并使用 onChangeText 更新,但我有点这个有问题。
当我将 console.log(index) 添加到 updateHashtags 时,它说它是未定义的,我无法理解我做错了什么或可以做些什么来完成这项工作。理论上,索引应该是每个文本字段的静态数字。因此,第一个文本字段将 hashtags[0] 作为其值,并使用“0”作为更新 hashtags 状态的索引。
当我使用:
console.log('index',index);
在 updateHashtags
中,我得到:
index undefined
代码如下:
const updateHashtags = (text, index) => {
let ht = hashtags;
ht[index].name = text;
setHashtags(ht);
}
const hashtagElement = (
<>
<Text style={styles.plainText} >Set Your Values:</Text>
<Text style={styles.instructionsText} >This is what other users use to search for you.</Text>
{hashtags.map((e,index) =>
<TextInput
placeholder='value'
key={e.name + index}
value={hashtags[index].name}
onChangeText={(text,index) => updateHashtags(text,index)}
style={styles.textInput}
/>
)}
<TouchableOpacity
onPress={() => {
let ht = hashtags;
let newht = {
name: '',
weight: 0,
};
ht[ht.length] = newht;
setHashtags(ht);
}}
>
<Ionicons
name="add-circle-outline"
size={40}
color={'black'}
/>
</TouchableOpacity>
</>
);
可能是 onChangeText 函数没有获取索引参数。
这样试试:
// we are getting index from here
{hashtags.map((e,index) =>
<TextInput
placeholder='value'
key={e.name + index}
value={hashtags[index].name}
// so no need of taking index from param here
onChangeText={(text) => updateHashtags(text,index)}
style={styles.textInput}
/>
)}
对于您的 updateHashTags 函数,请考虑以下安装:
const updateHashtags = (text, index) => {
// doing it this way ensures your are editing updated version of state
setHashtags((state) => {
let ht = state;
ht[index].name = text;
return ht;
});
}
我有一个 useState 变量,它有一个 JSON 对象数组,我正在尝试让文本字段动态呈现并使用 onChangeText 更新,但我有点这个有问题。
当我将 console.log(index) 添加到 updateHashtags 时,它说它是未定义的,我无法理解我做错了什么或可以做些什么来完成这项工作。理论上,索引应该是每个文本字段的静态数字。因此,第一个文本字段将 hashtags[0] 作为其值,并使用“0”作为更新 hashtags 状态的索引。
当我使用:
console.log('index',index);
在 updateHashtags
中,我得到:
index undefined
代码如下:
const updateHashtags = (text, index) => {
let ht = hashtags;
ht[index].name = text;
setHashtags(ht);
}
const hashtagElement = (
<>
<Text style={styles.plainText} >Set Your Values:</Text>
<Text style={styles.instructionsText} >This is what other users use to search for you.</Text>
{hashtags.map((e,index) =>
<TextInput
placeholder='value'
key={e.name + index}
value={hashtags[index].name}
onChangeText={(text,index) => updateHashtags(text,index)}
style={styles.textInput}
/>
)}
<TouchableOpacity
onPress={() => {
let ht = hashtags;
let newht = {
name: '',
weight: 0,
};
ht[ht.length] = newht;
setHashtags(ht);
}}
>
<Ionicons
name="add-circle-outline"
size={40}
color={'black'}
/>
</TouchableOpacity>
</>
);
可能是 onChangeText 函数没有获取索引参数。
这样试试:
// we are getting index from here
{hashtags.map((e,index) =>
<TextInput
placeholder='value'
key={e.name + index}
value={hashtags[index].name}
// so no need of taking index from param here
onChangeText={(text) => updateHashtags(text,index)}
style={styles.textInput}
/>
)}
对于您的 updateHashTags 函数,请考虑以下安装:
const updateHashtags = (text, index) => {
// doing it this way ensures your are editing updated version of state
setHashtags((state) => {
let ht = state;
ht[index].name = text;
return ht;
});
}