为什么在redux props之前反应钩子init
这是某种代码，所以要柔和一点:D
我有一些使用react钩子和redux的页面，redux的状态工作，我检查它加载数据。场景是我有一个页面，它从redux thunk加载输入框，并用钩子和redux thunk保存更改
const MyComponent = (props) => {
const { reduxProp } = props
const [t1, setT1] = useState('')
useEffect( () => {
reduxActionLoadData // t1 , t2 data
setT1(reduxProp.t1)
setT2(reduxProp.t2)
},[])
return (
<div>
<input value={t1} onChange={ (e) => { setT1(e.target.value) } />
<input value={t2} onChange={ (e) => { setT2(e.target.value) } />
</div>
)
}
const mapStateToProp = (state) => (
{
reduxProp: state.reduxProp
})
const mapDispatchToProp = (dispatch) => (
{
reduxActionLoadData = connectActionCreators(reduxActionLoadDataAction, dispatch)
})
export default const connect(mapStateToProps, mapDispatchToProps)(MyComponent)当我检查道具时，它是加载的，redux状态也加载了，但是用空值挂起了init。我试着用reduxProp.t1初始化它们，reduxProp.t2也不走运。问题是当我运行应用程序时，它工作得很好，但当我刷新页面时，它会失败，有时也会失败当我运行应用程序时，我会尝试使用加载状态，并在加载后做一些事情= true，两者都不走运
回答 1
Stack Overflow用户
发布于 2021-09-22 00:48:00
首先，您的mapDispatchToProp目前似乎没有做任何事情，因为使用=，它将被解析为一个方法体，而不是一个对象-所以您根本没有连接您的操作。它应该看起来更像这样：
const mapDispatchToProp = (dispatch) => (
{
reduxActionLoadData: connectActionCreators(reduxActionLoadDataAction, dispatch)
})那么您应该改用map对象表示法：
const mapDispatchToProp = {
reduxActionLoadData: reduxActionLoadDataAction
}你还必须在你的组件中实际使用它：
useEffect( () => {
props.reduxActionLoadData()
},[])这仍然会产生异步效果，所以reduxProp.t1不会立即改变。您可能必须稍后在单独的useEffect中更新这些内容。
useEffect( () => {
setT1(reduxProp.t1)
},[reduxProp.t1])总而言之，完全没有理由使用 connect ，因为您也可以使用useSelector和useDispatch挂钩。connect是一个只需要与遗留类组件一起使用的遗留应用程序接口。
一般来说，我会假设你现在正在学习一种非常过时的Redux风格，通过遵循过时的教程。现代的Redux没有使用switch..case reducer，ACTION_TYPE常量，手写的动作创建器，不可变的reducer逻辑或连接-它可能是旧式Redux代码的1/4。请按照官方Redux教程了解mondern Redux。https://redux.js.org/tutorials/essentials/part-1-overview-concepts
https://stackoverflow.com/questions/69278339
复制
腾讯云开发者
