不能从逻辑或||返回箭头函数

Question

我有一个场景，我可能不知道是否定义了某个对象属性。如果是，它应该是一个函数，并且应该被调用。未定义，表示创建备份功能。我正在使用逻辑||:

执行此操作。

// handleGetData may be undefined:
const { handleGetData, ActionCreators } = fromSomewhere; 
const getData =
handleGetData ||
function () {
dispatch(
ActionCreators.GetData({
params: params
})
);
};
getData()

这似乎工作得很好，除了eslint抱怨Unexpected unnamed function，但是当我试图在||之后返回一个箭头函数时，语法中断了:

const getData =
handleGetData ||
() => {             // <------  Parsing error: Expression expected
dispatch(
ActionCreators.GetData({
params: params
})
);
};

为什么会这样?如果没有定义handleGetData，那么getData的值不应该变成箭头函数，仍然是可调用的吗?

Codesandbox显示问题

Answer 1

在函数周围加上括号可以解决语法错误:

const getData =
handleGetData ||
(() => {
dispatch(
ActionCreators.GetData({
params: params,
})
);
});

eslint错误可能是由func-names规则引起的(详见此链接)。您可以通过添加函数名来修复它，例如handleGetDataFallback:

const getData2 =
handleGetData ||
function handleGetDataFallback () {
dispatch(
ActionCreators.GetData({
params: params,
})
);
};