如何在 for 循环中更新本机 useState 中的对象数组？

Question

我有一个包含对象数组的 state，我想在 for 循环中更新我的 object。 这是我的代码：每个对象都包含值、文本和时间。 时间应该在 for 循环内更新。

const [initialValues, setInitialValue] = useState([
        {
            value: 128,
            text: '128 Kb',
            time: ''
        },
        {
            value: 256,
            text: '256 Kb',
            time: ''
        },
        {
            value: 512,
            text: '512 Kb',
            time: ''
        },
        {
            value: 750,
            text: '750 Kb',
            time: ''
        },
        {
            value: 1024,
            text: '1 MB',
            time: ''
        },
        {
            value: 2048,
            text: '2 MB',
            time: ''
        },
        {
            value: 3072,
            text: '3 MB',
            time: ''
        },
        {
            value: 4096,
            text: '4 MB',
            time: ''
        },
        {
            value: 5120,
            text: '5 MB',
            time: ''
        }
    ]);

我想更新我的 state 的 for 循环：计算是一个 function，它将在用户端的onPress事件上被调用。

const [number, setNumber] = useState('1')
const [data, setData] = useState('1024')
const calculate = () => {
        if (number) {

            let size = number * data * 8
            size = percentage(12, size) + size;

            for (let value of initialValues) {
                let data = value.value;
                data = (size / data).toFixed();
                // here is my approach but not correct
                setInitialValue({ ...initialValues, time: data })

            }
        }
    }

但结果是不确定的。

Answer 1

你应该改变你的计算 function 到这个

const calculate = () => {
if (number) {
    let size = number * data * 8;
    size = percentage(12, size) + size;
    const newValues = [...initialValues.slice()];

    for (let i = 0; i < newValues.length; i++) {
        let data = (size / data).toFixed();
        newValues[i].time = data;
    }

    setInitialValue(newValues);
}
}

Answer 2

将初始值存储在变量中并像这样将其传递给 useState

const [initialValues, setInitialValue] = useState(initialVaule);
const [number, setNumber] = useState(1)
const [data, setData] = useState(1024)

const calculate = () => {
        if (number && data) {

            let size = number * data * 8
            size = percentage(12, size) + size;

           let updatedValue = intialValues.map( item => {
              return item.time = (size / data).toFixed();
           })
           setInitialValue(updatedValue);
        }
    }