And*_*man 14 reactjs redux react-redux
我useSelector从一个组件成功调用,该组件从 id 派生产品名称。
const productId = 25; // whatever
const productName = useSelector(
(state) =>
state.dashboard.dashboards.filter(
({ Id }) => Id === productId
)[0].Name
);
Run Code Online (Sandbox Code Playgroud)
但是,我的选择器依赖于productId,我将其存储在同一文件的变量中。我想将此useSelector调用存储在外部文件中,以便共享。我尝试以下,但id为undefined:
选择器.js
const productId = 25; // whatever
const productName = useSelector(
(state) =>
state.dashboard.dashboards.filter(
({ Id }) => Id === productId
)[0].Name
);
Run Code Online (Sandbox Code Playgroud)
some_file.js
import { useSelector } from "react-redux";
import { getProductNameById } from "./selectors";
const productId = 25;
const productName = useSelector(getProductNameById, productId);
Run Code Online (Sandbox Code Playgroud)
buz*_*tto 37
不幸的是,selector函数只接受商店的状态作为参数。我会考虑使用柯里化方法来解决这个问题:
export const getProductNameById = id => store => {
return store.dashboard.dashboards.filter(({ Id }) => Id === id)[0]
.Name;
}
Run Code Online (Sandbox Code Playgroud)
一些文件
import { useSelector } from "react-redux";
import { getProductNameById } from "./selectors";
const productId = 25;
const productName = useSelector(getProductNameById(productId));
Run Code Online (Sandbox Code Playgroud)
小智 25
似乎这样做的方法是这样的:
const productName = useSelector((state) => getProductNameById(state, productId));
Run Code Online (Sandbox Code Playgroud)
这就是 redux docs 教程似乎如何处理这个问题。 这里
| 归档时间: |
|
| 查看次数: |
6313 次 |
| 最近记录: |