使用proTable设置操作列固定

const columns: ProColumns<IssueItem>[] = [
   {
      title: '操作',
      valueType: 'option',
      key: 'option',
      width: 120,
      fixed: 'right'   //这里设置了固定
}

在Protable中

<ProTable<IssueItem>
        scroll={{ x: 1300 }}
        columns={columns}
        actionRef={actionRef}
        formRef={formRef}
        columnsState={{
          persistenceKey: 'pro-table-singe-demos',
          persistenceType: 'localStorage'
        }}
        rowKey="id"
        
        dateFormatter="string"
        toolBarRender={() => [
          <Button key="button" icon={<PlusOutlined />} type="primary" onClick={() => modelChange(true, 'add')}>
            新建
          </Button>
        ]}
      />

效果是,下面有滚动条,但是操作列不会固定,原因是因为我,直接copy的官网的例子,例子中有

columnsState={{
    persistenceKey: 'pro-table-singe-demos', //把这个的value值更新或者是直接不要设置columnsState就可以解决这个问题
persistenceType: 'localStorage'
}}

 

Copyright © 2024 凡凡0410
Powered by .NET 8.0 on Kubernetes