Итак, сначала у меня был компонент без сохранения состояния, и данные читаются нормально и вовремя, а затем, когда мне нужно было преобразовать их в компонент с состоянием, он по какой-то причине не работает, как должен. Это оставляет данные пустыми для этого компонента. Он даже не показывает строку Wait ... Это мой текущий компонент:
class ItemGroupComponent extends Component {
constructor(props){
super(props);
this.state = {
userShortcutAreLoading: false,
labelnameDefinition: [],
labelnamesAreloading: false,
itemGroupDefinition: [],
itemGroupIsLoading: false
}
}
componentDidMount(){
this.setState({
userShortcutAreLoading: this.props.userShortcutAreLoading,
labelnameDefinition: this.props.labelnameDefinition,
labelnamesAreloading: this.props.labelnamesAreloading,
itemGroupDefinition: this.props.itemGroupDefinition,
itemGroupIsLoading: this.props.itemGroupIsLoading
})
}
loadData(e, item){
console.log(e);
console.log(item);
}
render(){
if(this.state.labelnamesAreloading === true && this.state.itemGroupIsLoading === true){
return (<h1> Wait... </h1>) //it doesn't even show the wait...
}
console.log("ITEM GROUP");
console.log(this.state.itemGroupDefinition); //this is always empty
return (
<Button ui="button1" arrow={false} ripple={false} iconCls="icon-settings" border={false} >
<Menu title={this.state.labelnameDefinition['settings.tab.title']} ui='headerMenu'>
{this.state.itemGroupDefinition.map((item) =>
<MenuItem key={item.id} iconCls={item.iconCls} text={item.name} ui="menuItem1" handler={() => this.loadData}/>
)}
</Menu>
</Button>
)
}
}
const mapStateToProps = (state) => {
return {
userShortcutAreLoading: state.coreuireducer.userShortcutAreLoading,
labelnameDefinition: state.coreuireducer.labelnameDefinition,
labelnamesAreloading: state.coreuireducer.labelnamesAreloading,
itemGroupDefinition: state.coreuireducer.itemGroupDefinition,
itemGroupIsLoading: state.coreuireducer.itemGroupIsLoading
}
};
const mapDispatchToProps = (dispatch) => {
return {
actions: bindActionCreators(itemGroupAction, dispatch)
}
};
export default connect(mapStateToProps, mapDispatchToProps) (ItemGroupComponent);
-Часть кода, который вызывает ItemGroupComponent:
<NavItem className="d-md-down-none ">
{/*Search menu*/}
<NavLink href="#" data-toggle="tooltip" title="Settings">{/*<i className="icon-settings"></i>*/}
<ItemGroupComponent />
</NavLink>
</NavItem>