Redux-saga store modal状态存放问题

#1

场景前提：

  1. 用 Modal 弹出一个表单，用户填写必要信息后创建新的项
  2. 后台返回提交表单提交成功后才关闭
  3. 提交失败不关闭modal

伪代码：

function* fetchUser(action) {
   try {
      const user = yield call(Api.fetchUser, action.payload.userId);
      yield put({type: "USER_FETCH_SUCCEEDED", user: user});
      //  假设这里是提交表单成功，可以关闭modal
   } catch (e) {
      yield put({type: "USER_FETCH_FAILED", message: e.message});.
     //  假设这是 提交表单失败，不允许关闭弹框
   }
}

疑问：

  1. 在使用redux-saga的前提下，这个modal的visible状态存放在哪里？ 放在store还是组件内部
  2. 放在store里面，显示或者隐藏modal都是通过action来触发，可以比较好的在提交表单数据给后台之后根据后台返回码来判断是否关闭modal，但是放在store又感觉略显啰嗦
  3. 放在组件内部，我不太清楚怎么在组件内获取后台返回的状态，
1 Like
#2

建议放store里,如果要强行放组件内部,那就将设置方法当参数传入saga的effect函数中,

#3

谢谢，把更改modal的方法传进去是一个思路，没想到。

可能是以前写vue的习惯，ajax请求都是return一个promise，就可以很方便的在组件内部控制modal的状态，用了sage之后发现不好弄

#4

感觉 modal 的状态不涉及共享，可以考虑放在组件内部

#5

这个怎么说那，看你这个modal弹框具体是干嘛用的，如果像你说的那样就是纯粹为了展示一下，其实我个人觉得完全可以写在组件内部，没有必要循环跑到store中走这圈，但是如果有多个地方使用这个 visible 属性这样的话考虑到其他调用方便，这个的放到store完全是有必要的。