0
私は反応ネイティブ（expo）イベントアプリで作業していますが、私のモックイベントのIDが更新されていて、それらがの整数の場合、IDがの場合この問題はありません。アレイ内のReduxアイテムのIDが更新されています
基本的な流れは、ユーザーがそのイベントを押すとそのイベントビューに表示されるイベントのリストを表示します。 eventInFocusとevents * reducersを使用し、** 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リデューサ
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 - 単一のイベントビュー
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の約欠けている何かがありますか？私のレデューサーは構造が貧弱ですか？私にとって混乱する部分は、文字列ではなく整数でのみ起こる理由です。前もって感謝します！あなたは以前の状態がすでにここでイベント