在react组件之外访问redux存储的最佳方式是什么?

@connect在尝试访问react组件中的存储时效果非常好。但是我应该如何在其他代码中访问它呢。例如:假设我想使用授权令牌来创建可以在我的应用程序中全局使用的axios实例,那么实现这一点的最佳方法是什么

这是我的api.js

//工具模块
从“axios”导入axios
//配置
const api=axios.create()
api.defaults.baseURL=http://localhost:5001/api/v1'
api.defaults.headers.common['Authorization']='AUTH_TOKEN'//此处需要该令牌
api.defaults.headers.post['Content-Type']='application/json'
导出默认api

现在,我想从我的存储访问一个数据点,如果我试图使用@connect在react组件中获取它,则会出现这种情况

//连接到存储
@连接((存储)=&gt{
返回{
auth:store.auth
}
})
导出默认类应用程序扩展组件{
组件willmount(){
//这就是我在我的react组件中得到它的方式
log(this.props.auth.tokens.authorization\u token)
}
render(){…}
}

有什么见解或工作流程模式吗

使用调用的模块createStore导出存储。然后,您可以放心,它将被创建,并且不会污染全局窗口空间

MyStore.js

const store=createStore(myReducer);
出口商店;

const store=createStore(myReducer);
导出默认存储;

MyClient.js

从“/MyStore”导入{store}
存储调度(…)

或者如果您使用了默认值

从“/MyStore”导入存储
存储调度(…)

对于多个存储用例

如果需要存储的多个实例,请导出factory函数。
我建议将其设置为异步(返回承诺

异步函数getUserStore(userId){
//检查用户存储是否存在,并返回或创建它。
}
导出getUserStore

在客户端上(在async块中)

从“/store”导入{getUserStore}
const joeStore=wait getUserStore('joe')

发表评论