1

我有一个如下图所示的问题： 文本

正如你们所看到的，我有每件商品的信息：名称和库存。现在我想通过在文本输入中输入一个数字来更新单个项目的库存但是当我在 1 个文本输入中输入 3 时，它会在所有剩余的文本输入中填充 3。这是我的渲染项目：

renderItem = ({item}) => {
    return (
      <View style={styles.card}>
        <TouchableOpacity
          onPress={() => {
            setCreateAt(item.WarehouseProduct.createdAt);
            setNote(item.note);
            setShowModal(true);
          }}>
          <Image
            style={styles.tinyLogo}
            source={require('../assets/images/fish.jpg')}
          />
        </TouchableOpacity>
        <View
          style={{
            flexDirection: 'column',
            alignItems: 'center',
            justifyContent: 'center',
            marginLeft: 5,
            height: 75,
            width: 160,
          }}>
          <Text numberOfLines={2} style={styles.text}>
            {item.name}
          </Text>
          <Text style={styles.text}>
            {item.WarehouseProduct.stock.toString()}
          </Text>
        </View>
        <View style={styles.iconcontainer}>
          <Button title="clear" onPress={() => console.log(text)} />
        </View>
        <View
          style={{
            alignSelf: 'center',
            marginLeft: 20,
            borderWidth: 1,
            borderRadius: 10,
          }}>
          <TextInput
            style={{height: 40, width: 50}}
            keyboardType="numeric"
            onChangeText={(income) => setText(income)}
            value={text}
          />
        </View>
      </View>
    );
  };

谁能帮我解决这个问题？给我一个想法。谢谢大家！

4

2 回答 2

0

您放入 renderitem 的任何内容都将与您在 flatlist 中的数据一样多地呈现

<Flatlist 
  data={containtmultipledata}
  renderItem={
    ....
    <TextInput
        style={{height: 40, width: 50}}
        keyboardType="numeric"
        onChangeText={(income) => setText(income)}
        value={text}
      />
    ....
  }
>

但是您将其分配给单个值

您可以通过 item 中的索引直接更改放入 flatlist 中的数据

 <TextInput
    style={{height: 40, width: 50}}
    keyboardType="numeric"
    onChangeText={(txt) => containMultipledata[index].yourObjectName = txt}
    value={item.yourObjectName}
  />
于 2020-11-03T08:20:10.570 回答
0

试试这个方法

const [data, setData] = useState([... flat list data here default]);

const onTextChanged = (index, value) => {
    const data = [...data]; 
    data[index].availableStock = value; <-- "availableStock" is example key for showing way out of this -->
    setData(data);
}

renderItem = ({item, index}) => {
    return (
      <View style={styles.card}>
        ......
        <TextInput
            ...
            onChangeText={(income) => onTextChanged(index, income)}
            value={item.availableStock || 0}
          />
      </View>
    );
};
于 2020-11-03T08:24:32.413 回答