首页 > 解决方案 > 使用 setstate 更改字典,但不起作用。反应

问题描述

const [days, setDays] = useState({ Monday: false, Tuesday: false,Wednesday: false,Thursday: false, Friday: false,Saturday: false,Sunday:false });

const [traildays, setTrialDays] = useState('MON,WED,THUR,SAT');

const Changedays = async () => { 
        if(traildays.includes('MON') == true) {setDays({...days,Monday:!days.Monday})}
        if(traildays.includes('TUE') == true) {setDays({...days,Tuesday:!days.Tuesday})}
        if(traildays.includes('WED') == true) {setDays({...days,Wednesday:!days.Wednesday})}
        if(traildays.includes('THUR') == true) {setDays({...days,Thursday:!days.Thursday})}
        if(traildays.includes('FRI') == true) {setDays({...days,Friday:!days.Friday})}
        if(traildays.includes('SAT') == true) {setDays({...days,Saturday:!days.Saturday})}
        if(traildays.includes('SUN') == true) {setDays({...days,Sunday:!days.Sunday})}

traildays这是它的要点,我想根据字符串中是否提到它来更改每天的真假。发生的事情只是周六变成了真的。

在此处输入图像描述

我认为这与 ...days 重置一切有关,但任何帮助将不胜感激,谢谢。

标签: javascriptreactjsdictionaryreact-hooksuse-state

解决方案


你是对的,每个 setter 都使用相同的 days 值const [days, setDays]并覆盖它的一个字段。请改用方便的形式setDays(prevValue => newValue)。作为参数,您会收到最新的模型状态,因此可以逐步应用您的更改:

if(traildays.includes('MON') == true) {
  setDays(prevDays => {
    return {...prevDays, Monday:!days.Monday};
  });
}

推荐阅读