Reactjs 如何更换组件'；你的状态如何？

在

MenuItemContainer

export default class MenuItemsContainer extends React.Component {
 constructor () {
  super();
  this.state = {
  currentMenu: [],
  };
}

我使用如下函数渲染菜单项

_renderMenuItems(menuitems) {
    const { order } = this.props;

    return menuitems.map((menuitem) => {
        if (menuitem.category_id == this.props.order.currentCategoryId) {
                this.state.currentMenu.push(menuitem)

        else {
            return false;
        }

        return <MenuItem
                key={menuitem.id}
                order={order}
                dispatch={this.props.dispatch}
                channel={this.props.order.channel}
                {...menuitem} />;
    });
}

\u rendernumitems（菜单项）{
const{order}=this.props；
返回menuitems.map（（menuitem）=>{
if（menuitem.category\u id==this.props.order.currentCategoryId）{
this.state.currentMenu.push（菜单项）
否则{
返回false；
}
返回；
});
}

我想用

currentMenu

做的是存储

menuItems

，其中

menuItem

的

category\u id

等于订单状态的

currentCategoryId

现在我正在使用

push（menuitem）

将这些项推送到状态。但是，在

currentMenu

中，只有当

menuItem

的category_id等于订单状态的

currentCategoryId

时，它才应该存储。因此当

currentCategoryId

发生更改时，它应该重置

currentMenu

并获取新的

menuItem

我该怎么做？

---

提前感谢

为了实际触发状态更改，您需要通过setState执行此操作 因此，您可以在_renderNuItems方法的末尾添加setState命令，如下所示：

this.setState({currentMenu: state.currentMenu})

但是更好的做法是让状态已经包含正确的项，而不是在render方法中过滤它

---

从您的示例中，我不确定您是如何获取menuItems的，但理论上，您应该从它们构建状态，然后调用_renderNuItems方法（将使用状态）

我使用的是

phoenix framework

。当用户加入频道时，它会将所有

菜单项

传递到状态。是否可以在reducer中查询？对于

当前菜单

。例如，我的所有

菜单项

都处于有序状态，因此如果我可以在reducer中通过

类别id

进行查询，这将是最好的方法t

currentMenu

我不熟悉phoenix框架。你在这里使用redux吗？它是如何设置状态的？理论上，如果它设置为状态，你可以使用componentDidUpdate来过滤你的东西