如何组合自定义钩子和选择器结果？

Question

我有一个自定义钩子，也有一些选择器，需要根据两者的组合设置最终标志。我不能简单地编写一个结合了以下代码的函数，因为钩子或选择器都不能在react FC之外使用。使像这样的整个块成为某个地方的单个可重用函数的最佳方法是什么？// selector    const { activeIntents, writeRole, intents, permalink } = useSelector(state => state.companyIntentsReducer);// custom hook    const { hasExtendedRoleForCompany } = useJwtRoles();// func calling the custom hook    const intentWrite = hasExtendedRoleForCompany("intent-manage-write", permalink);// final result combines both    const editMode = writeRole && intentWrite自定义钩子可以使用选择器吗？

Answer 1

你应该写一个自定义钩子，比如：

const useEditMode = () => {

  const { activeIntents, writeRole, intents, permalink } = useSelector(

    (state) => state.companyIntentsReducer

  );

  const { hasExtendedRoleForCompany } = useJwtRoles();

  const intentWrite = hasExtendedRoleForCompany(

    "intent-manage-write",

    permalink

  );

  return { isEditMode: writeRole && intentWrite };

};

export default useEditMode;

// Usage inside function component

const { isEditMode } = useEditMode();