2

我学习 JavaScript 和 React Redux 并有这个问题：。

假设我有这个 Redux dispatch：

dispatch(setLogMessage( () =>{"Connecting to env1", 12340, "connecting"}));

减速器就在这里，因为上面setLogMessage是这样的：

   const initialState = {
     log: "",
   };

    case booksActionTypes.LOG_MESSAGE: {
      return {
        ...state,
        log: action.payload,
      };
    }

在mapStateToProps它看起来像这样：

  const [theLog, addLog] = useState([]);

      useEffect(() => {
        if (props.log !== "") {
          addLog([...theLog, createData(props.log)]);
        }
      }, [props.log]);
    
      function createData(message, timestamp, type) {
        console.log('s');
        return { message, timestamp, type };
      }

问题是我到处玩，想在这种情况下学习箭头功能，并希望拥有上述props.log功能，成为解决上述问题() =>{"Connecting to env1", 12340, "connecting"})并将其传递给function createData(... 希望你能理解我的问题！

4

1 回答 1

5

从箭头函数立即返回对象可能在语法上令人困惑......

看起来是在{打开一个新对象，但实际上它是在打开一个函数体。

要解决此问题，请将对象括在括号中（还要注意对象属性名称）：

() => ({ message: "Connecting to env1", timestamp: 12340, type: "connecting"})

第二个问题是你永远不会调用这个函数。

props.log保存该函数引用，因此要将其值作为参数获取，createData您需要调用它（并传递各个值）。

const values = props.log();
createData(values.message, values.timestamp, values.type);

概括

  1. 隐式返回需要在返回对象时用括号括起来。
  2. 对象必须包含一个属性名称，而不仅仅是一个值（这就是数组的用途）
  3. 必须调用函数，而不仅仅是作为道具传递。
于 2021-04-09T18:19:43.637 回答