gpt4 book ai didi

javascript - 数组中的 Redux 项目的 id 正在更新

转载 作者:行者123 更新时间:2023-12-03 03:02:40 25 4
gpt4 key购买 nike

我正在开发一个 react 原生(博览会)事件应用程序,我遇到了一个问题,即我的模拟事件的 ID 被更新,而它们不应该仅在它们是整数时才更新 em>,当 id 是字符串时,我没有这个问题。

基本流程是我显示事件列表,当用户按下该事件时,他们将进入该事件 View 。我通过使用 eventInFocusevents* 缩减器并在 **eventView 容器中查找我需要的事件来完成此操作。

当我按下某个特定事件时,所有事件 ID 都会更新,并且很难调试,因为它表明先前的状态已经具有混合的 ID,这非常令人困惑,因为在渲染中的项目时没有问题主视图(循环数组,使用 id 作为键)。如果我选择第一个事件,则会收到一条错误消息,指出无法找到该事件;如果我选择其他 2 个事件中的任何一个,则事件 ID 会随机更新。

事件缩减器

const defaultEvents = [{
id: 0,
name: 'my birthday',
date: new Date(),
repeatAnnually: false,
wallPaperSource: null
},{
id: 1,
name: 'yosemite trip',
date: new Date(),
repeatAnnually: true,
wallPaperSource: null
}, {
id: 2,
name: 'trip to dublin',
date: new Date(),
repeatAnnually: false,
wallPaperSource: null
}];

const event = (state, action) => {
switch (action.type) {
case EVENT_EDITED:
if(state.id !== action.event.id){
return state;
}
return action.event;
default:
return state;
}
}

function events(state = defaultEvents, action){
switch(action.type){
case ADD_EVENT:
return [
...state,
{
id: action.event.id,
name: action.event.name,
date: action.event.date,
repeatAnnually: action.event.repeatAnnually,
wallPaperSource: action.event.wallPaperSource || null
}];
case EVENT_EDITED:
return state.map(e =>
event(e, action)
)
default:
return state;
}
}

eventInFocus reducer

function eventInFocus(state = {}, action){
switch(action.type){
case "UPDATE_EVENT_IN_FOCUS":
return Object.assign({}, state, action.event);
case VIEW_EVENT:
return Object.assign({}, action.event);
default:
return state;
}
}

eventContainer - 列表中每个项目周围的容器(主视图)

const mapStateToProps = (state, ownProps) => {
return {
ownProps
}
}

const mapDispatchToProps = (dispatch, ownProps) => {
return {
onPress: (event)=> {
dispatch(viewEvent(event));
}
}
}

viewEventContainer - 用于单个事件 View

const mapStateToProps = (state, ownProps) => {
const {events, eventInFocus } = state;
viewEvent = find(events, e => e.id = eventInFocus.id);
return {
event: viewEvent,
ownProps
}
}

const mapDispatchToProps = (dispatch, state) => {
return {
onEditEvent: (event) => {
dispatch(editEvent(event));
}
}
}

const EventViewContainer = connect(
mapStateToProps,
mapDispatchToProps
)(EventView);

viewEvent 操作

export const viewEvent = (event) => {
return {
type: VIEW_EVENT,
event
}
}

关于 redux,我有什么遗漏的吗?我的 reducer 结构是否很差?对我来说,令人困惑的部分是为什么它只发生在整数而不是字符串上。预先感谢您!

当我按下某个事件时的状态,您可以看到之前的状态已经具有事件的突变 ID

最佳答案

这是代码中存在错误的一行:

viewEvent = find(events, e => e.id = eventInFocus.id);
^
here

正如您所看到的,state 在每次调用 mapStateToProps 时都会发生变化。

关于javascript - 数组中的 Redux 项目的 id 正在更新,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47300280/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com