道具更改后反应组件不会重新渲染答案

【问题标题】：React component is not re-rendering after props change道具更改后反应组件不会重新渲染
【发布时间】：2018-09-19 09:19:33
【问题描述】：

使用 Ant Design Framework 的 React 组件在更新 props 时不会重新渲染。数据在控制台中显示更新，但在列表标签中不更新。这是我的代码的一部分。

   render() {
   const props = this.props;
   data=[
   {
       'title':'name1',
       'content':props.data.content1
   },
   {
       'title':'name2',
       'content':props.data.content2
   },
   ]
   console.log("Data..",data);
   return (
    <Page {...props}>
        <Helmet title="Organizations" />
        <div className="card">
           <div className="card-header">
             <div className="utils__title">
                <strong>Organization Details</strong>
              </div>
            </div>
      <div className="card-body" span={20}>
        <div className="organization">
          <div className="organization_details">
            <List
              grid={{ gutter: 16, column: 1 }}
              dataSource={data}
              size="small"
              renderItem={item => (
                <List.Item>
                  <Card className="list1" title={item.title} bordered={false}>
                    {item.content}
                  </Card>
                </List.Item>
              )}
            />
           </div>
         </div>
       </div>
      </div>
      </Page>
    )

}

【问题讨论】：

如何将props传递给上面组件的render函数？
在向该组件传递道具时使用标签的 key 属性

标签： reactjs react-redux antd

【解决方案1】：

我认为这里的 data 不是您要使用的 data 变量。

使用 const 就可以解决问题！

// Destructure your props like this
const { props } = this;

const data=[
   {
       'title':'name1',
       'content':props.data.content1
   },
   {
       'title':'name2',
       'content':props.data.content2
   },
]

【讨论】：