我有一个利用Oauth2“重定向流”对用户进行身份验证的应用程序,即,用户被重定向到另一个网站以登录,然后被重定向回我的站点。

文档和其他资料似乎都声称业务逻辑应该在 Action 创建者或简化器中进行。但是,我有一个login()函数,该函数不会以任何方式更改状态,它的作用是将应用程序的当前状态另存为localStorage中的普通对象,然后将用户重定向到授权服务器。当用户登录并重定向回该状态时(通过另一段代码),该状态将作为初始状态提供给我的商店创建者功能。

我的问题:login函数的逻辑只是检索状态,但不会以任何方式更改它,因此它不属于reducer。它也不会返回 Action ,它是 Action 创建者的定义。我应该在应用程序结构中的哪个位置放置它?

可以创建一个实际上不创建 Action 的 Action 创建者“可以”吗?我现在正在使用redux-thunk进行此操作(因为我需要getState()),它可以正常工作,但是感觉不对,因为它实际上不是“ Action 创建者”,另一方面,我也有一个logout()函数,确实会返回一个 Action ,因此感觉他们应该住在同一个地方。我想这是一个极端的情况,但这并不是真的,因为我能想到很多原因来保存这种状态并将访客重定向到其他站点(甚至只是保存状态而不进行重定向)。

PS。我知道有一些库可以自动将我的redux存储与localStorage同步,但这并不是问题的关键。

编辑:一些澄清:

Redux docs中将业务逻辑放在何处:
对于在化简器或 Action 创建器中应该采用哪些逻辑,没有一个明确的答案。

继续读下去,很清楚,我应该在两个地方放置业务逻辑,无论是简化器还是 Action 创建器。现在,由于我要执行的操作不会影响状态,而reduce定义上会影响状态,因此我倾向于将这种逻辑放入 Action 创建者中。

有关 Action 创建者的文档: Action 创建者就是这样-创建 Action 的功能。将术语“ Action ”和“ Action 创建者”混为一谈是很容易的,因此请尽最大努力使用适当的术语。 [...]在Redux Action 创建者中,只需返回一个 Action

有关操作的文档:操作是纯JavaScript对象。

我的登录示例的伪代码:

function login() {
    // retrieving and serializing the state, then:
    localStorage.set('my_app_id_state', my_serialized_state);
    window.location = url_to_authorization_service;
}

显然,此代码在 Action 创建者中没有位置,因为我没有返回 Action ,这是 Action 创建者的目的。但是,我仍然需要检索状态,因此也无法使其完全独立。

再次,问题是我将这段代码放在应用程序结构中的什么位置?

同样,该代码可以正常工作,并且一切都很好,所以我想这更多是一个学术问题,但这使我很烦恼,我在这里显然违反了Redux的基本规则。也许只是一个异常(exception)?

最佳答案

这是一个很好的问题,使我意识到我做错了什么。因此,希望这个答案至少对两个都有帮助:)

Real World Redux example改编为例:

私有(private)功能

function oauth(url) {
 return (dispatch) => {
   dispatch({
    type: types.OAUTH_LOGIN,
    url
   });
 };
}

由 Action 创建者调用(它返回一个函数)
export function loginToApi(redirectUrl) {
  return (dispatch) => {
    return dispatch(oauth(redirectUrl))
  }
}

然后依次在组件中调用该操作,如下所示:
login() {
 return this.props.dispatch(loginToApi());
}

因此,回答问题的一种方法是将业务逻辑放入私有(private)方法中,然后由操作创建者调用该方法。

也许有一种更优雅的方法,但这就是我在上面提到的文档中完成的方法。

关于用于将状态存储在本地存储中的登录逻辑:我认为您不需要这样做。 Redux商店正在为您管理状态。

关于javascript - 是否不影响状态的Redux应用程序业务逻辑?,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/37834069/

10-12 13:01
查看更多