UseState для обновления переменной экземпляра многих переменных внутри объекта

const [emoji, setEmoji] = useState({
like: 0,
love: 0,
laugh: 0,
sad: 0,
wow: 0,
angry: 0,

})


const emojiCount = () => {

  isReacted 
  ? 
  setEmoji(emoji => ({...emoji, laugh: emoji.laugh+1}))
  :
  setEmoji(emoji => ({...emoji, laugh: emoji.laugh-1}))
  setIsReacted(!isReacted)

  }
  • isReacted — это просто логическое состояние!

То, что я пытаюсь реализовать, - это обрабатывать все состояние с помощью функции "emojiCount", я хочу знать, могу ли я передать "смех" как динамическую переменную, где это может быть "любовь" или "нравится" и т. д..

Формы c голосовым вводом в React с помощью Speechly
Формы c голосовым вводом в React с помощью Speechly
Пытались ли вы когда-нибудь заполнить веб-форму в области электронной коммерции, которая требует много кликов и выбора? Вас попросят заполнить дату,...
Flatpickr: простой модуль календаря для вашего приложения на React
Flatpickr: простой модуль календаря для вашего приложения на React
Если вы ищете пакет для быстрой интеграции календаря с выбором даты в ваше приложения, то библиотека Flatpickr отлично справится с этой задачей....
Приложение для отслеживания бюджета на React js для начинающих
Приложение для отслеживания бюджета на React js для начинающих
Обучение на практике - это проверенная тема для достижения успеха в любой области. Если вы знаете контекст фразы "Практика делает человека...
Стоит ли использовать React в 2022 году?
Стоит ли использовать React в 2022 году?
В 2022 году мы все слышим о трендах фронтенда (React, Vue), но мы не знаем, почему мы должны использовать эти фреймворки, когда их использовать, а...
Как передать состояние или данные в react-router v6
Как передать состояние или данные в react-router v6
react-router - это лучшая библиотека для работы с маршрутизацией в reactjs. С помощью react-router вы передаете состояние или данные от одного...
0
0
19
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Я думаю, что вы хотите динамически передавать ключ объекта, вы можете сделать это следующим образом:

const [emoji, setEmoji] = useState({
  like: 0,
  love: 0,
  laugh: 0,
  sad: 0,
  wow: 0,
  angry: 0,
});


const emojiCount = (emojiIcon) => {
  setEmoji({
    ...emoji,
    [emojiIcon]: emoji[emojiIcon] + 1,
  });
}

Поэтому, если вы вызовете функцию типа emojiCount("laugh"), она обновит клавишу смеха, увеличив значение смеха на 1.

Вот песочница с динамическими кнопками, которые обновляют эмодзи: https://codesandbox.io/s/adoring-benz-2zeyzh?file=/src/App.js

Другие вопросы по теме