Добавление значения в массив нажатием кнопки
У меня есть массив. Это имеет значение объектов. В 1 массиве для 1 объекта есть 3 значения.
Это проект ReactJS.
Например так
const x = useMemo(() => [
[1, 1, 1],
[2, 2, 2],
[3, 3, 3],
[4, 4, 4],
[5, 5, 5],
]);
Теперь у меня есть кнопка.
Мой вопрос: «Как или какую функцию я могу добавить к своей кнопке, чтобы она изменила среднее значение [1] каждого массива»
Например: после нажатия кнопки я хочу добавить [ - 0,5 * 2 ] в среднее значение.
!!! Нажмите !!!
const x = useMemo(() => [
[1, 1, 1],
[2, 2, 2],
[3, 3, 3],
[4, 4, 4],
[5, 5 - 0.5 * 2, 5],
[6, 6 - 0.5 * 2, 6]
]);
!!! Нажмите [2-й раз] !!!
const x = useMemo(() => [
[1, 1, 1],
[2, 2, 2],
[3, 3 - 0.5 * 2, 3],
[4, 4 - 0.5 * 2, 4],
[5, 5 - 0.5 * 2, 5],
[6, 6 - 0.5 * 2, 6]
]);
!!! Нажмите [3-й раз] !!!
const x = useMemo(() => [
[1, 1 - 0.5 * 2, 1],
[2, 2 - 0.5 * 2, 2],
[3, 3 - 0.5 * 2, 3],
[4, 4 - 0.5 * 2, 4],
[5, 5 - 0.5 * 2, 5],
[6, 6 - 0.5 * 2, 6]
]);
И так далее.
@SandeepAmarnath После первых 3 раз он переходит в положение по умолчанию.
![Интервьюер: Почему '[] instanceof Object' возвращает "true"?](https://cdn-images-1.medium.com/max/120/0*3Q2LAQJh9HQrdTPK)
Ответы 1
import { useState } from 'react';
export default function DemoPage() {
const [positions, setPositions] = useState([
[1, 1, 1],
[2, 2, 2],
[3, 3, 3],
[4, 4, 4],
[5, 5, 5],
]);
const targetIndex = positions.length - 1;
const clickHandle = () => {
const nextPositions = positions.map((items, index) => {
if (targetIndex === index) {
// If there are more array items, you can use `.map` .
// return items.map((value) => value * 2);
return [items[0], (items[1] - 0.5) * 2, items[2]];
}
return items;
});
setPositions(nextPositions);
console.info('positions :>> ', positions);
};
return (
<div>
<p>position is { positions[targetIndex].join(',') }</p>
<button type = "button" onClick = {clickHandle}>Click</button>
</div>
);
}Чтобы обновить массив, смотрите здесь: https://beta.reactjs.org/learn/updating-arrays-in-state#replacing-items-in-an-array
Рекомендуется использовать «use-immer», что упрощает обновление данных.
Использование-иммер: https://www.npmjs.com/package/use-immer
Могу ли я сделать это без использования «useState»?
Вот актуальные проблемы, как видите, я хочу изменить значение «позиций» codeandbox.io/s/5thhhhhhhhhh-30q7f2?file=/src/components/…
Я хотел бы спросить, почему вы хотите использовать «useMemo», я немного смущен вашими потребностями? beta.reactjs.org/reference/react/useMemo
Пожалуйста, посмотрите код, который я прикрепил к ссылке. Тогда вы поймете, почему я использую «useMemo». Я использую «useMemo», чтобы изменить положение комнаты. Но я не знаю других простых способов сделать это. Но если у вас есть другое решение для «useState» вместо «useMemo», сообщите мне, пожалуйста :) Спасибо!
Извините, я не ясно выразил свои сомнения, "useMemo" - это хук, который кэширует результат вычисления, пожалуйста, проверьте документы в предыдущем комментарии для деталей, один из его параметров - реактивное значение, поэтому я прочитал ваш код и Я до сих пор не знаю ваших потребностей, можете ли вы подробно описать свои требования и предоставить минимальный вариант использования?
Я пытался использовать ваш код, но он не работает или, возможно, не отображается в режиме реального времени/демонстрации. Нужно ли использовать «useEffect»? И, кстати, мне нужно изменить положение комнаты с помощью «useState» или «useMemo» или любым другим способом. Вот код, в котором я использую вашу функцию: codeandbox.io/s/4-thhhhhhhhhhhh-zpi03t?file=/src/components/…
Теперь все работает нормально, проблема была в том, что "useState" не вступало в силу при обновлении значений в массиве, см.: beta.reactjs.org/learn/… , я заменил его на более простой "useImmer" для обновления данные, код здесь: codeandbox.io/s/4-thhhhhhhhhhhhh-forked-ocmu2z?file=/src/…
Спасибо! Как я могу добавить его в качестве петли для остальных комнат? На данный момент он работает для комнаты номер 8, поэтому я хочу зациклить его для всех комнат. Ваша помощь будет очень признательна.
Вам просто нужно просмотреть обновленные данные, см. здесь: codeandbox.io/s/4-thhhhhhhhhhhh-forked-ocmu2z?file=/src/…
Я хотел зациклить их один за другим, как вы показали предыдущий, но они были только для комнаты «номер 8», поэтому я хотел попробовать таким образом для каждой комнаты. Например: если я нажму «кнопку 2», то «номер 8» опустится, а если я снова нажму на нее, то «комната 7» опустится, а затем снова и снова.
Уменьшение индекса — это нормально. codeandbox.io/s/4-thhhhhhhhhhhh-forked-ocmu2z?file=/src/…
Давайте продолжим обсуждение в чате.
@ Симао, не могли бы вы проверить этот вопрос? stackoverflow.com/questions/75124249/…
Что должно произойти в 4-й раз? В первые 3 раза все средние значения могли быть преобразованы, поэтому интересно, не должно ли преобразование происходить в 4-й раз?