Reactjs 未在呈现的html中更新道具,但已从呈现()在console.log中更新道具
我有一个导航菜单,正在使用react scroll lib收听滚动 工作: 我将激活的元素保存到我的存储中,所以每次我滚动一个新元素时,我的存储都知道哪个元素是“激活的” 当我显示导航菜单时,我想从我的存储中检查哪个元素是活动的,并在某个导航元素上添加一个类。我无法使用react scroll执行此操作,因为我的元素是嵌套的(我想根据当前react scroll活动元素突出显示一些中间导航元素) 无论如何,当我滚动时,存储被更新,监听此存储值的组件被重新呈现,render方法被调用,render()内部的console.log显示“selectedMenu”的正确值(这是我的存储值),**但是**,render()的return()生成的html不会更新“selectedMenu”变量值 有关第一次显示的信息,selectedMenu为空,因为未单击/滚动任何内容。此空值保留在渲染的返回中,但会在渲染()中的console.log中更新 变得疯狂Reactjs 未在呈现的html中更新道具,但已从呈现()在console.log中更新道具,reactjs,redux,react-redux,Reactjs,Redux,React Redux,我有一个导航菜单,正在使用react scroll lib收听滚动 工作: 我将激活的元素保存到我的存储中,所以每次我滚动一个新元素时,我的存储都知道哪个元素是“激活的” 当我显示导航菜单时,我想从我的存储中检查哪个元素是活动的,并在某个导航元素上添加一个类。我无法使用react scroll执行此操作,因为我的元素是嵌套的(我想根据当前react scroll活动元素突出显示一些中间导航元素) 无论如何,当我滚动时,存储被更新,监听此存储值的组件被重新呈现,render方法被调用,render
render(){
const {opened, menuId, sub, selectedMenu, selectedCat, setActiveDispatch, anchorKey, titleKey, subClickedDispatch} = this.props;
console.log('****** selectedMenu : ' + selectedMenu); // displaying the updated value
console.log('****** selectedCat : ' + selectedCat); // displaying the updated value
const subData = sub.map((subcat, index)=> {
console.log("inside map & selectedMenu : " + selectedMenu); // displaying the updated value
console.log("inside map & selectedCat : " + selectedCat); // displaying the updated value
return (
<div key={menuId+'_'+index}>
<SubMenuChildren>
<Link isDynamic={true} offset={-80} onSetActive={(to)=>setActiveDispatch(to)} to={subcat[anchorKey]+"_top_empty"} spy={true} smooth={true} duration={500}><ListItem innerDivStyle={{padding:'0px 0 0px 0px'}} style={{height:'0px'}}></ListItem></Link>
</SubMenuChildren>
<SubMenuChildren>
{/* selectedMenu NOT UPDATED : is empty, subcat[anchorKey] is ok */}
<div>test : {selectedMenu} {subcat[anchorKey]}</div>
{/* selectedCat NOT UPDATED : is empty, subcat[anchorKey] is ok */}
<div>test : {selectedCat} {subcat[anchorKey]}</div>
{/* test is always false as selectedMenu is always empty */}
<Link isDynamic={true} className={selectedMenu==subcat[anchorKey]?'active':''} offset={-80} onSetActive={(to)=>setActiveDispatch(to)} to={subcat[anchorKey]} spy={true} smooth={true} duration={500} onClick={()=>subClickedDispatch(subcat)}><ListItem innerDivStyle={{padding:'5px 0 5px 5px'}} style={this.style.navSubElements} hoverColor='transparent' primaryText={ subcat[titleKey] }></ListItem></Link>
</SubMenuChildren>
</div>
);
});
return (
<div className={opened?'subMenu open':'subMenu close'}>
<div>retest : {selectedMenu}</div> {/* value is updated !*/}
{subData}
</div>
);
}
该死
IRC的人刚刚找到了它。
问题来自未更新的组件(未发布在此处)(shouldComponentUpdate始终返回false)。卸下此SCU并恢复所有工作
const mapStateToProps=(state)=>({
clickedMain: state.appReducer.clickedMain,
selectedMenu: state.appReducer.selectedMenu,
selectedCat: state.appReducer.selectedCat});