Reactjs 什么';我的react redux应用程序中有错误,因为它';它没有按预期呈现事物吗?
我开始使用redux,只是为了测试一下,我开始使用combineReducers进行更结构化的设计,但它的工作原理与大家建议的不同。我一直在琢磨我的方法有什么问题,因为我遵循了他们官方网站上的每一点 index.jsReactjs 什么';我的react redux应用程序中有错误,因为它';它没有按预期呈现事物吗?,reactjs,redux,react-redux,redux-reducers,Reactjs,Redux,React Redux,Redux Reducers,我开始使用redux,只是为了测试一下,我开始使用combineReducers进行更结构化的设计,但它的工作原理与大家建议的不同。我一直在琢磨我的方法有什么问题,因为我遵循了他们官方网站上的每一点 index.js import React from 'react'; import {createStore} from 'redux'; import {Provider} from 'react-redux'; import ReactDOM from 'react-dom'; import
import React from 'react';
import {createStore} from 'redux';
import {Provider} from 'react-redux';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import reducer from './reducer';
import Welcome from './Components/Welcome';
const store=createStore(reducer);
ReactDOM.render(
<Provider store={store}>
<App />
<Welcome/>
</Provider>,
document.getElementById('root')
);
searchreducer.js
const initialstore={
item:1,
search:1
}
function searchreducer(state=initialstore,action)
{
return state;
}
export default searchreducer;
import {combineReducers} from 'redux';
import loginreducer from './loginreducer';
import searchreducer from './searchreducer';
export default combineReducers({
loginreducer,
searchreducer
})
reducer.js
const initialstore={
item:1,
search:1
}
function searchreducer(state=initialstore,action)
{
return state;
}
export default searchreducer;
import {combineReducers} from 'redux';
import loginreducer from './loginreducer';
import searchreducer from './searchreducer';
export default combineReducers({
loginreducer,
searchreducer
})
当我dispatch({type:FIRST})之后在Welcome.js中console.log(count)
时
我没有定义,但在应用程序中我应该得到哇,这是伟大的0
问题是,您组合了减速器,但从mapStateToProps调用状态时,忘记添加实际引用的减速器,因此未定义
我给你的减速机加了钥匙,这样打外线电话就容易多了。并更新了MapStateTops
下面是修复您的问题的示例
/*reducer.js*/
import {combineReducers} from 'redux';
import loginreducer from './loginreducer';
import searchreducer from './searchreducer';
export default combineReducers({
lr: loginreducer, // <== Check this line
sr: searchreducer // <== Check this line
})
/*welcome.js*/
const mapStateToProps=(store) =>({
count:store.lr.count, // <== Check this line
})
export default connect(mapStateToProps)(Welcome);
/*reducer.js*/
从'redux'导入{combinereducer};
从“/loginreducer”导入loginreducer;
从“./searchreducer”导入searchreducer;
导出默认合并器({
lr:loginreducer,//记录状态或使用redux devtools,您将看到状态。我已记录了调度前的状态,显示计数1,调度后的总计1显示两者均未定义。您是否发现任何错误?@Mayanktiwari我在您的减速机组合中未看到任何名为count
的属性。如果您记录store
在mapStateToProps
中,您看到了什么?一个可复制的示例将有助于well@Mayanktiwari在您的mapStateToProps中记录状态或使用devtools。如果人们只是检查devtools,大约90%的关于SO的redux问题不会出现在这里。\n好的,我将从现在开始使用谢谢,这是我缺少的:)