我有一个状态存储的对象数组,每个对象存储要用于渲染组件的值:
starting claim 4
spin: couldn't find claim 4 (ignored)
Starting Actor_a with pid 2
2: proc 0 (:init::1) sample.pml:30 (state 1) [(run Actor_a())]
Starting Actor_b with pid 3
3: proc 0 (:init::1) sample.pml:31 (state 2) [(run Actor_b())]
Starting Actor_c with pid 4
4: proc 0 (:init::1) sample.pml:32 (state 3) [(run Actor_c())]
6: proc 1 (Actor_a:1) sample.pml:14 (state 1) [ch[0] = (ch[0]+2)]
7: proc 1 (Actor_a:1) sample.pml:14 (state 2) [((ch[0]>sz[0]))]
7: proc 1 (Actor_a:1) sample.pml:14 (state 3) [sz[0] = ch[0]]
a 7: proc 1 (Actor_a:1) sample.pml:14 (state 7) [printf('a')]
9: proc 1 (Actor_a:1) sample.pml:14 (state 1) [ch[0] = (ch[0]+2)]
10: proc 1 (Actor_a:1) sample.pml:14 (state 2) [((ch[0]>sz[0]))]
10: proc 1 (Actor_a:1) sample.pml:14 (state 3) [sz[0] = ch[0]]
a 10: proc 1 (Actor_a:1) sample.pml:14 (state 7) [printf('a')]
12: proc 1 (Actor_a:1) sample.pml:14 (state 1) [ch[0] = (ch[0]+2)]
13: proc 1 (Actor_a:1) sample.pml:14 (state 2) [((ch[0]>sz[0]))]
13: proc 1 (Actor_a:1) sample.pml:14 (state 3) [sz[0] = ch[0]]
a 13: proc 1 (Actor_a:1) sample.pml:14 (state 7) [printf('a')]
15: proc 1 (Actor_a:1) sample.pml:14 (state 1) [ch[0] = (ch[0]+2)]
16: proc 1 (Actor_a:1) sample.pml:14 (state 2) [((ch[0]>sz[0]))]
16: proc 1 (Actor_a:1) sample.pml:14 (state 3) [sz[0] = ch[0]]
a 16: proc 1 (Actor_a:1) sample.pml:14 (state 7) [printf('a')]
spin: trail ends after 17 steps
#processes: 4
ch[0] = 8
ch[1] = 0
sz[0] = 8
sz[1] = 0
17: proc 3 (Actor_c:1) sample.pml:24 (state 5)
17: proc 2 (Actor_b:1) sample.pml:19 (state 11)
17: proc 1 (Actor_a:1) sample.pml:13 (state 9)
17: proc 0 (:init::1) sample.pml:34 (state 5) <valid end state>
4 processes created
我试图编写一个单击按钮时更新对象数组的函数。我已将按钮设置为调用函数const activeModal = [
{ modalName: 'dashboard', modal: Dashboard, active: true, icon: DashboardIcon, iconColor: 'black', iconBackground: 'white' },
{ modalName: 'memsline', modal: MEMsLine, active: false, icon: MEMsLineIcon, iconColor: 'white', iconBackground: 'black' },
{ modalName: 'mems', modal: MEMsGrid, active: false, icon: MEMsIcon, iconColor: 'white', iconBackground: 'black' },
{ modalName: 'events', modal: Events, active: false, icon: EventIcon, iconColor: 'white', iconBackground: 'black' },
{ modalName: 'people', modal: People, active: false, icon: PeopleIcon, iconColor: 'white', iconBackground: 'black' },
{ modalName: 'places', modal: Places, active: false, icon: PlaceIcon, iconColor: 'white', iconBackground: 'black' },
{ modalName: 'music', modal: Music, active: false, icon: MusicIcon, iconColor: 'white', iconBackground: 'black' },
{ modalName: 'movies', modal: Movies, active: false, icon: MovieIcon, iconColor: 'white', iconBackground: 'black' },
{ modalName: 'tvshows', modal: TVShows, active: false, icon: TVIcon, iconColor: 'white', iconBackground: 'black' },
{ modalName: 'games', modal: Games, active: false, icon: GameIcon, iconColor: 'white', iconBackground: 'black' },
{ modalName: 'settings', modal: UserSettings, active: false, icon: SettingsIcon, iconColor: 'white', iconBackground: 'black' }
]
openModal
并按以下方式传递回onClick
:
modalName
但是,当我单击按钮时,没有任何反应。我期望发生的事情是,openModal = modalType => () => {
this.setState(state => {
const updatedActiveModal = state.activeModal.map(item => {
if (item.active === true) {
return {
modalName: item.modalName,
modal: item.modal,
active: false,
icon: item.icon,
iconColor: 'white',
iconBackground: 'black'
};
} else if (item.modalName === modalType) {
return {
modalName: item.modalName,
modal: item.modal,
active: true,
icon: item.icon,
iconColor: 'black',
iconBackground: 'white'
};
} else {
return item;
}
});
return {
updatedActiveModal,
};
});
};
对象数组已更新,以将当前活动的activeModal
值更改为active
,将false
更改为{{1 }}和iconColor
至'white'
。它还应将单击的模式的backgroundColor
值从'black'
更改为active
,将单击的模式false
更改为true
和iconColor
到'black'
并将所有更改保存到backgroundColor
。我无法弄清楚我在做什么错,因为代码看起来应该可以工作。
答案 0 :(得分:2)
我认为您只需要更改:
return {
updatedActiveModal,
};
到
return {
activeModal: updatedActiveModal,
};