TypeError: Cannot read properties of undefined (reading 'hovered')
来源:7-7 使用 combineReducers 完成对数据的拆分管理
阿ccciii
2021-11-04
reducer.js
import { combineReducers } from "redux";
import * as headerReducer from "../common/header/store";
export default combineReducers({
headerReducer
});
headerReducer
const defaltState = {
hovered: false
};
export default function headerReducer(state = defaltState, action) {
if(action.type === 'navitem_hover'){
console.log('123');
return {
hovered: true
}
}
return state;
}
index.js
import React, { Fragment } from 'react';
import { connect } from 'react-redux';
import styles from './style.css'
import * as actionCreators from './store/actionCreators';
import NavItemList from './NavItemList';
const getNavItemList = (show) => {
if(show){
return <NavItemList></NavItemList>;
}else{
return null;
}
}
const Header = props => {
return (
<Fragment>
<div className={styles.headerWrapper}>
<a className={styles.logo}/>
<div className={styles.Nav}>
<div className={styles.NavItem}><a>首页</a></div>
<div onMouseEnter={props.handleHovered}
className={styles.NavItem}><a>方案解决</a></div>
<div className={styles.NavItem}><a>服务支持</a></div>
<div className={styles.NavItem}><a>加入我们</a></div>
<div className={styles.NavItem}><a>关于我们</a></div>
</div>
</div>
{getNavItemList(props.hovered)}
</Fragment>
)
}
const mapStateToProps = state => {
return{
hovered: state.headerReducer.hovered
}
}
const mapDispatchToProps = dispatch => {
return{
handleHovered(){
dispatch(actionCreators.NavItemHover());
}
}
}
export default connect(mapStateToProps, mapDispatchToProps)(Header);
老师这个地方是哪里有问题呀?
写回答
1回答
-
Dell
2021-11-04
state.headerReducer 应该不存在,你看看是不是state 里面的数据拿的不对
00
相似问题