Table列表包含select时，功能实现

需求:Table列表有select选择，列表上方有功能按钮。按钮1是对数据源筛选，只显示已选择的数据当列表的数据源(与slelect是或关系)，按钮2是是条件按钮(与select是并且关系)

    const CommonTable = () =>{
      const [resourcesCurrentPage, setResourcesCurrentPage] = useState(1);
      const [resourcesPageSize, setResourcesPageSize] = useState(10);
      const [selectedRowKeys, setSelectedRowKeys] = useState([]);
      const [selecterRows, setSelecterRows] = useState([]);
      const [checkValue, setCheckValue] = useState([]);
      
      const totalNum = 3;
      const onResourcesPageChange = (page, size) => {
        if (resourcesPageSize === size) {
          setResourcesCurrentPage(page);
        } else {
          setResourcesCurrentPage(1);
          setResourcesPageSize(size);
        }
      };
      const resourcesPagination = {
        total: totalNum,
        showSizeChanger: true,
        showTotal: () => `共有${totalNum}条`,
        onChange: onResourcesPageChange,
        pageSize: resourcesPageSize,
        current: resourcesCurrentPage,
      };
      const onSelectChange = (newSelectedRowKeys, newselecterRows) => {
        setSelectedRowKeys(newSelectedRowKeys);
        setSelecterRows(newselecterRows);
      };
      const rowSelection = {
        selectedRowKeys,
        onChange: onSelectChange,
      };
      const onChange = (newCheckedValues) => {
        console.log(selecterRows,'checked = ', newCheckedValues);
        setCheckValue(newCheckedValues);
      };

      const options = [
        {
          label: '只显示已选中',
          value: '1',
        },
        {
          label: '地图显示选中的',
          value: '2',
        },
      ];
      const renderInlineFooter = () => {
        return (
          <div style={{ display: 'flex', justifyContent: 'space-between' }}>
            <div>已选{selectedRowKeys.length}条</div>
            {totalNum > 10 && <Pagination {...resourcesPagination}></Pagination>}
          </div>
        );
      };
      
        return (
            <div className={styles.CommonTable}>
              <div className={styles.CommonCheck}>
                <Checkbox.Group options={options} onChange={onChange} />
              </div>
              <Table
                rowKey={(record) => record.planIndex}
                rowSelection={rowSelection}
                columns={columns}
                bordered={true}
                dataSource={checkValue.includes('1') ? selecterRows : resourceList}
                pagination={totalNum > 100 ? resourcesPagination : false}
                footer={renderInlineFooter}
                rowClassName={ recode => recode.id === MapTag ? 'rowActive' : ''}
                style={{ padding: '0 10px' }}
              />
              <div className={styles.CommonButton}>
                <Button type="primary" onClick={closeClick}>
                  保存
                </Button>
              </div>
            </div>
          );
    }

判断当前选择的按钮是否包含1，对应切换数据源。

判断当前按钮是否包含2，进行其他操作。

列表footer显示当前已选择多少条