Question

一些背景我正在构建一个应用程序来下订单餐厅的食物。它具有一个全局购物车对象，该对象存储购物车中有哪些项目以及有多少个项目。在我的购物车屏幕上，我有一个平板列表，其中显示了购物车中的所有物品。我在一个代表数量的平面列表中的每个项目内都有一个选择器。当我尝试更改该值时，它会立即重置为原始值。调用onValueChange时，它将正确处理更改并设置新值，但是一旦这样做，该值就会以某种方式再次更改并重置为先前的值。我有一个几乎相同的选择器，可以使用一个状态良好的状态存储的变量，但是在这种情况下，它将需要一个数组，我无法将其合并到flatlist中。

我尝试将函数调用直接传递到购物车，以检索selectedValue的数量。 cart对象中的信息是正确的，它只是通过onValueChange的调用而不断重置。我尝试过将状态列表存储在状态中，因此当值更改时，正如某些人建议的那样，我将其称为setState。我尝试将数据直接设置为调用购物车以获取所有数据

编辑：我在构造函数中设置了一个变量，除非实际按下onValueChange，否则它将禁止其运行。我通过使选择器周围具有可触摸的不透明度来完成此操作，并将onpress设置为更改变量，然后一旦onValueChange运行，我将再次更改变量。即使所有这些，选择器中显示的值也不会改变。价值本身就起作用了，因为我在购物车中显示了更改的所有商品的总价，但是由于某些原因，选择器没有：（

<FlatList
    data={this.state.data}
    renderItem={({item}) => 
        //other components
        <Picker
            selectedValue={item.quantity}
            style={{height: 50, width: 85, paddingRight: 10}}
            onValueChange={(itemValue, itemIndex) => {
                console.log('val changed called')
                global.cart.setQuantity(item, itemValue)
                this.setState({data: global.cart.getData()})
                console.log('after set q = ' + global.cart.getQuantity(item))
                }
            }
        >
            <Picker.Item label="1" value="1"/>
            <Picker.Item label="2" value="2"/>
            <Picker.Item label="3" value="3"/>
            <Picker.Item label="4" value="4"/>
            <Picker.Item label="5" value="5"/>
            <Picker.Item label="6" value="6"/>
            <Picker.Item label="7" value="7"/>
            <Picker.Item label="8" value="8"/>
            <Picker.Item label="9" value="9"/>
            <Picker.Item label="10" value="10"/>
        </Picker>
    }
/>

global.cart中的功能

setQuantity = (item, num) => {
    let i = this.searchItem(item)
    this.items[i].quantity = num
    console.log("new quantity = " + this.items[i].quantity)
}

getQuantity = (item) => {
    let i = this.searchItem(item)
    return (this.items[i].quantity)
}

预期的selectedValue会随着用户选择一个数字而改变，该值始终会重置

Answer 1

我相信global.cart.getData()返回相同的对象，并且该组件未重新呈现。试试：

renderItem={({item, index}) =>
...
onValueChange = {(value) => {
  let newData = [...this.state.data];
  newData[index] = {...newData[index], quantity:value};
  this.setState({data: newData});
}}

选择器值不断重置

1 个答案: