Question

我正在关注this video on youtube to learn redu x

此处讲师通过执行以下操作来创建化简器（我们称其为后化简器，当将其导入到rootreducer时它将与其他化简器合并

import { FETCH_POST, NEW_POST } from '../actions/type.js'


const initialState = {
  items: [],
  item: {}
}

export default function(state = initialState, action) {
  switch (action.type) {
      default:
        return state
  }

}

import { FETCH_POST, NEW_POST } from '../actions/type.js'以上是动作类型，仅包含以下内容

export const FETCH_POST = 'FETCH_POST';
export const NEW_POST = 'NEW_POST';

现在，因为这与redux有关，所以我了解acton的作用，但是当我们不导入任何东西且动作似乎未定义时，我不知道如何在这里获得动作。

也许他会在以后解决此问题，但只是检查我是否缺少什么？

类似地，在视频中播放了几分钟（根据youtube视频，大约是42分钟），他创建了一个postAction文件夹，其中有这样的内容

import { FETCH_POST, NEW_POST } from '.type.js'
import axios from 'axios';


export const fetchPosts = () => {
  return (dispatch) {
    axios.get("https://jsonplaceholder.typicode.com/posts").then(response => dispatch({
      type: FETCH_POST,
      payload: res
    })


  }

}

甚至没有导入任何东西，他在上面的代码中扩展了开关条件，像这样

export default function(state = initialState, action) {
  switch (action.type) {
    case FETCH_POST:
      return {
        ...state,
        items: action.payload 
      }
      default:
        return state
  }

类似于我们的第一个示例，这里的动作是什么，当我们没有导入任何东西时，它如何知道我们的action.type？

Answer 1

当您在网络呼叫的dispatch({ type: FETCH_POST, payload: res })中呼叫then时，这会将类型FETCH_POST的操作分派给化简器。与该动作类型匹配的化简器将为您的状态返回一个新值。

减速器中的操作引用正在分派的对象，即{ type: FETCH_POST, payload: res }

Answer 2

我认为您在这里缺少Redux最重要的概念：一切都围绕孤立的纯函数

Default output device: bbox
类似于我们的第一个示例，这里的动作是什么以及如何知道没有导入任何东西时，我们的action.type会如何？

这是一个reducer，它的核心只是一个纯函数（就像Redux中的大多数事情一样），所以您真的不在乎导入任何内容，因为action只是函数的参数，Redux库将请注意在执行调度时调用此函数，届时操作类型将由开关检查。

但是这里最重要的一点是，您不需要导入任何东西，只需要正确地编写减速器即可，并期望某些类型的动作，因为您也知道动作创建者，它们又是纯函数，仅返回带有强制性export default function(state = initialState, action) { switch (action.type) { case FETCH_POST: return { ...state, items: action.payload } default: return state }属性的对象，该属性在大多数情况下具有字符串值

有关操作类型的说明

2 个答案: