componentWillReceiveProps不触发

  • Z时代
  • 2024-01-10
  • 分类：问答

在我的其他课程中，componentWillReceiveProps运行良好，但是由于某种原因，它在这里没有触发。

ItemView.jsx

class ItemView extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            name: null, 
            rating: null, 
            sector: null, 
            location: null, 
            description: null, 
            image: "blank.png",
            show: false
       };
    }
    ...
    componentWillReceiveProps(nextProps) {
        if(!nextProps.companyToRender) {
            this.setState({
                name: null, 
                rating: null, 
                sector: null, 
                location: null, 
                description: null, 
                image: "blank.png",
                show: false
            });
       }
       else {
           var companyToRender = nextProps.companyToRender;
           this.setState({
               name: companyToRender.name, 
               rating: companyToRender.rating, 
               sector: companyToRender.sector, 
               location: companyToRender.location, 
               description: companyToRender.description, 
               image: companyToRender.image,
               show: true
           });
    }
    ...
    render () {
       return(
        <div>
         ...
        <CommentBox show={this.state.show} companyToRender={this.state.name}/>
         ...
        </div>
       );
    }
}

CommentBox.jsx

class CommentBox extends React.Component {
    constructor(props) {
        super(props);
        this.state = {companyToRender: null};
    }
    componentWillReceiveProps(nextProps) {
        this.setState({companyToRender: nextProps.companyToRender});
    }
    ...
}

如果不传递任何内容，则传递给itemView的prop为null，或者ItemView为其分配的数组。

仅当状态的属性为null时，componentWillReceiveProps（）才会触发，而当状态为null时，组件不会触发。（（null->条目）不起作用，但是（entry->

null）起作用）。

我错过了什么吗？谢谢！

-编辑：

（空->条目）更新状态，但不调用日志或任何后续componentWillRecieveProps（）。（但是输入-> null会。）

记录为null->条目

输入日志-> null

回答：

经过大量痛苦的调试之后，我发现问题在于在某种模式（react-

bootstrap）内调用了ItemView，该模式出于某种原因不支持componentWillReceiveProps（）。最终通过重构代码解决了该问题。多谢你们！

以上是 componentWillReceiveProps不触发 的全部内容， 来源链接： utcz.com/qa/421844.html

回到顶部