Redux - 将 ownProps 参数传递给选择器 [英] Redux - pass ownProps argument to selector
本文介绍了Redux - 将 ownProps 参数传递给选择器的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我无法将变量 ownProps
从 mapStateToProps
传递给选择器.我的选择器:
I cannot pass variable ownProps
from mapStateToProps
to selector. My selector:
export const nameSelector = createSelector(
[
state => state.element.get('name')
],
(name) => !name.trim()
);
const mapStateToProps = (state, ownProps) => ({
disabledAfterSave: nameSelector(state)
});
而且我需要一个选择器:
And I need to have a selector:
export const nameSelector = createSelector(
[
state => state.element.get('name')
],
(name, ownProps) => !name.trim() && ownProps.showMessage
);
const mapStateToProps = (state, ownProps) => ({
disabledAfterSave: nameSelector(state, ownProps)
});
但现在我收到一个错误:ReferenceError: ownProps is not defined
.
But now I get an error: ReferenceError: ownProps is not defined
.
当我尝试像下面这样传递它时:
When I tried to pass it like below:
export const nameSelector = (ownProps) => createSelector(
[
state => state.element.get('name')
],
(name) => !name.trim() && ownProps.showMessage
);
返回的类型不是 bool 而是 [Function selector]
.如何将此参数传递给我的选择器?
the returned type is not bool but [Function selector]
.
How can I pass this argument to my selector?
推荐答案
以下是修复选择器及其用法的方法:
export const nameSelector = createSelector(
[
state => state.element.get('name'),
(state, ownProps) => ownProps.showMessage
],
(name, showMessage) => !name.trim() && ownProps.showMessage
)
const mapStateToProps = (state, ownProps) => ({
disabledAfterSave: nameSelector(state, ownProps)
})
<小时>
这是一个通用的工作示例,以说明如何将 props 向下传递给选择器:
const createSelector = Reselect.createSelector
// Selector: Get Active Users
const getUsers = createSelector([state => state.users], users => users.filter(u => u.active))
// Selector: Get Active Users by Country
// Here you can check how I pass the country prop
const getUsersByCountry = createSelector([getUsers, (state, props) => props.country],
(users, country) => users.filter(u => u.country === country))
// The state
const state = {
users: [
{ id: 1, name: 'Jordan', country: 'Bulgaria', active: true},
{ id: 2, name: 'Nadezhda', country: 'Bulgaria', active: true},
{ id: 3, name: 'Hristo', country: 'Bulgaria', active: false},
{ id: 4, name: 'Bobby', country: 'England', active: true},
{ id: 5, name: 'Kaloyan', country: 'Germany', active: true},
]
}
// Testing
console.log(getUsers(state))
console.log(getUsersByCountry(state, { country: 'Bulgaria' }))
<script src="https://cdnjs.cloudflare.com/ajax/libs/reselect/3.0.1/reselect.min.js"></script>
这篇关于Redux - 将 ownProps 参数传递给选择器的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文