首页 文章

Redux模式获取状态在行动创作者

提问于
浏览 次
1

我已经确定了2个在动作创建者中获取状态的模式，我想知道哪个更好：

  • 使用redux-thunk和getState

  • mapStateToProps在组件中，并在调用动作创建者时将状态传递回Redux

每个例子：

class SomeComponent {
    render() {
        return (
            <Button onPress={this.props.networkCall}/>
        )
    }
}

const mapDispatchToProps = {
    networkCall: actions.networkCall,
}

export default connect(undefined, mapDispatchToProps)(SomeComponent)

export networkCall() {
    return (dispatch, getState) => {
        const { dataForNetworkCall } = getState().someReducer
        dispatch(pending())
        axios.get(`something/${dataForNetworkCall}/something2`)
            .then(() => {
                dispatch(success())
            }
            ...
    }
}

要么

class SomeComponent {
    render() {
        const { networkCall, dataForNetworkCall } = this.props
        return (
            <Button onPress={networkCall(dataForNetworkCall)}/>
        )
    }
}

function mapStateToProps(state) {
    const { dataForNetworkCall } = state.someReducer
    return { dataForNetworkCall }
}

const mapDispatchToProps = {
    networkCall: actions.networkCall,
}

export default connect(mapStateToProps, mapDispatchToProps)(SomeComponent)

export networkCall(dataForNetworkCall) {
    return (dispatch) => {
        dispatch(pending())
        axios.get(`something/${dataForNetworkCall}/something2`)
            .then(() => {
                dispatch(success())
            }
            ...
    }
}

我觉得2是个坏主意，因为它涉及将状态传递给Component只是为了将它传递给Redux . 但是，网上似乎有很多文章说选项1是反模式（包括Dan Abramov himself saying it is an anti-pattern） . 那么，"best"方式是什么？

react-native redux react-redux redux-thunk

1 回答

  • 2

    我总是遵循后一个例子，这意味着我的动作创建者不依赖于 store . 但是，有一种情况我必须将用户令牌传递给几乎所有需要与服务器API交互的操作 . 我没有反复将它传递给每个动作创建者或使用 getState() 访问它，而是编写了一个自定义中间件（并不那么困难），它可以识别这些动作并用另一个名为 userToken 的道具来丰富它们 .

    回到丹阿布拉莫夫的回答 . 他在评论中说：

    可以从动作创建者的商店中读取 .

    这对我来说很困惑，但我认为他的意思是因为某些原因这样做很好：

    我认为可以接受的是在发出请求之前检查缓存数据，或者检查您是否经过身份验证（换句话说，执行条件派遣）

    ......并且使用 getState 可能会导致以下情况：

    ...很难追踪那些不正确的值来自哪里，因为它们已经是动作的一部分，而不是由减速器直接计算以响应动作 .

    我认为他的意思是动作创建者不应该传递被reducer替换的商店的更新部分，但是动作应该描述正在发生的事情并且reducers应该处理更新：

    Not:

    这是新项目列表 - 在商店中替换它

    But:

    我们需要删除id为5的项目 - 处理它

    ...这与从商店访问值以在请求中使用它的情况略有不同 . 我是advice you to read the linked blog . 它深入回答了你的问题，并且有一些关于什么最好的例子 . TL; DR - 这是一种辩论，哪种方法更好 .

    回复于

相关问题