【React工作记录四十五】react中子组件的数据更新视图未更新解决

目录

前言

导语

代码部分

总结

解决思路

前言

我是歌谣 我有个兄弟 巅峰的时候排名c站总榜19 叫前端小歌谣 曾经我花了三年的时间创作了他 现在我要用五年的时间超越他 今天又是接近兄弟的一天人生难免坎坷 大不了从头再来 歌谣的意志是永恒的 放弃很容易 但是坚持一定很酷

导语

在日常的工作过程中 会遇到各种各样的问题 今天就是遇到一个问题 子组件的state更新之后视图不更新

编辑

代码部分

<div key={staffList[0].key} style={style}>
        <Card>
          <BaseTabs tabs={dailyStatusList} onTabSearch={this.handleTabSearch} />
        </Card>

        {staffList &&
          staffList.map((staff, index) => (
            <TableTemplate
              key={index}
              code={code}
              title={staff.name}
              partnerType={partnerType}
              dispatch={dispatch}
              menu={menu}
              baseInfo={baseInfo}
              employeeType={employeeType}
              tableLoading={tableLoading}
              educationList={educationList}
              employeeTypeList={employeeTypeList}
              identityTypeList={identityTypeList}
              openBankList={openBankList}
              positionLevelList={positionLevelList}
              sexList={sexList}
              statusList={statusList}
              yesornoList={yesornoList}
              organizationTree={organizationTree}
              positionTree={positionTree}
              type={type}
              codeDictionary={codeDictionary}
            />
          ))}
      </div>

handleTabSearch = (value) => {
    const { dailyStatusList } = this.state;
    let staffList = dailyStatusList.filter((item) => {
      return item.key == value;
    });
    console.log(staffList, 'staffList');
    this.setState({
      staffList,
      employeeType: value,
    });
  };

总结

解决思路

key={staffList[0].key}