Javascript 无法在现有状态转换期间更新-未使用任何非法的setState（）

有人请帮我解决这个错误 无法在现有状态转换期间更新

当我渲染这个的时候，我得到了如下的错误

无法在现有状态转换期间更新（例如在

渲染

或其他组件的构造函数）。渲染方法应该是 道具和状态的纯粹功能；构造函数的副作用是 反模式，但可以移动到

组件willmount

我试着把这个.props.ifListChanged（这个）放进去组件中的这段代码将进行更新，组件将进行升级，但这段代码花费的时间太长，但没有错误（几乎2分钟）

从“React”导入React；
从“./ListItem.jsx”导入ListItemComponent；
从“./DropDownButton.jsx”导入DropDownButton组件；
从“../../../../css/sass/drop-down.scss”导入DropDownStyle；
module.exports=React.createClass({
handleClick:函数（）{
this.setState（{open:！this.state.open}）；
},
getInitialState:函数（）{
返回{
开：错，
//listItems:this.props.listItems，
selectedItems:[]，
标题：this.props.dropdownTitle
}
},
handleItemClick:功能（项目）{
var selectedItems=[]；
if（this.props.multiple==true）{
selectedItems=this.state.selectedItems；
if（selectedItems.indexOf（item）=-1）{
选择editems.push（项目）；
}否则{
selectedItems.splice（selectedItems.indexOf（项目），1）
}
这是我的国家({
标题：this.state.selectedItems.length+“selected”，
selectedItems:selectedItems
});
}否则{
selectedItems=[]；
选择editems.push（项目）；
这是我的国家({
标题：项目，
selectedItems:selectedItems，
开放：假
});
}
//this.sendStateToParent（）；
},
sendStateToParent:函数（）{
this.props.ifListChanged（this）；
},
handleTextChange:函数（事件）{
var filteredItems=[]；
this.props.listItems.map（函数（项）{
if（item.toLowerCase（）.search（event.target.value.toLowerCase（））！=-1）{
filteredItems.push（项目）；
}
}，这个）；
这是我的国家({
listItems:filteredItems
});
},
已选函数：函数（）{
这是我的国家({
标题：this.props.dropdownTitle，
selectedItems:[]，
});
},
渲染：函数（）{
this.props.ifListChanged（this）；
var指数=0；
var列表=[]；
if（this.state.listItems！=未定义）{
list=this.state.listItems.map（函数（项）{
返回(
);
}.约束（这个）；
}否则{
list=this.props.listItems.map（函数（项）{
返回(
);
}.约束（这个）；
}
返回

{this.props.search？
：“”
从下面的列表中选择{this.props.multiple？：“”
{list}

}
});

ListItem.jsx

import React from 'react';

module.exports = React.createClass({
  handleClick: function() {
    this.props.whenItemClicked(this.props.item);
  },
  render: function() {
    return <li onClick={this.handleClick} className={this.props.className}>
      <a>{this.props.item}</a>
    </li>
  }
});

import React from 'react';

module.exports = React.createClass({
  render: function() {
    return <button  onClick={this.props.whenClicked} className="btn dropdown-toggle btn-default" type="button">
      <span className="filter-option pull-left">{this.props.title}</span>
      <span className="bs-caret"><i className="fa fa-chevron-down"></i></span>
    </button>
  }
});

从“React”导入React；
module.exports=React.createClass({
handleClick:function（）{
单击时的this.props.（this.props.item）；
},
render:function（）{
return

{this.props.item}

}
});

DropDownButton.jsx

import React from 'react';

module.exports = React.createClass({
  handleClick: function() {
    this.props.whenItemClicked(this.props.item);
  },
  render: function() {
    return <li onClick={this.handleClick} className={this.props.className}>
      <a>{this.props.item}</a>
    </li>
  }
});

import React from 'react';

module.exports = React.createClass({
  render: function() {
    return <button  onClick={this.props.whenClicked} className="btn dropdown-toggle btn-default" type="button">
      <span className="filter-option pull-left">{this.props.title}</span>
      <span className="bs-caret"><i className="fa fa-chevron-down"></i></span>
    </button>
  }
});

从“React”导入React；
module.exports=React.createClass({
render:function（）{
返回
{this.props.title}
}
});

---

提前感谢帮助我的人。谢谢。

我想你有一个道具/状态设计问题。渲染函数中的

this.props.ifListChanged（this）

非常可疑。渲染函数不需要向父级发送任何信号。父级已经知道它发送下来的所有道具，如果父级需要知道状态，那么它很可能首先不应该是状态

从你的代码中我可以收集到

• 列表组件接收未筛选的项目列表作为道具
• 它有一个跟踪filtereditems和selecteditems的状态

如果两者的结果都需要通过组件本身内部的另一个操作（例如，流程选择按钮或其他东西）发送到某处，这是一个很好的设置。
然后（也只有那时）你才会把状态发送给父母或其他地方

如果家长需要始终了解这两方面（例如，当流程按钮或流程操作位于其他位置时），则最好：

• 在父级中定义一些

  handleFilterUpdate

  和“handleSelectionUpdate”方法，并将它们作为道具传递给子级
• 还将筛选的列表和选择从父级传递给子级
• 每当选择或筛选器出现问题时，从子级调用

  this.props.handleFilterUpdate

  和'this.props.handleSelectionUpdate'

---

我想你没有看到我的全部问题。请看一下代码。据我所知，我没有调用任何非法的setState（）函数@在

render（）

中调用父函数的原因非常奇怪（可能是非法的）。

this.props.ifListChanged（this）

有什么作用？我只想将ChildCoManent的状态发送到它的parentComponent。但是当我在handleItemClick（）中使用它时，会发送上一个状态@Wintvelt家长对您发送的筛选列表做了什么？我猜：该函数会触发父对象的另一个呈现，也会触发子对象的呈现，react不允许这样做。在你的设置中，这将是一个道具/状态设计问题。我已经尝试将它放在其他函数中，并显式调用该函数。但当我叫它的时候。它正在通过它的旧状态。假设我有clicke