ANTD 可編輯標題行

Question

我需要在表格中創建一個可編輯的標題行。 我嘗試將第一行操作為標題行，而隱藏了真正的標題。 它運作良好，但在將其轉換為新頁面時出現問題，因為第一行不會顯示在第二頁上。 我是否可以自定義和編輯表格標題行？

Answer 1

import { useState } from "react";
import { Table, Typography } from "antd";
import { data } from './data'


export const App = () => {
  const [editableStr, setEditableStr] = useState(
    "This is an editable text."
  );

  const columns = [
    {
      title: (
        <Typography.Text editable={{ onChange: setEditableStr }}>
          {editableStr}
        </Typography.Text>
      ),
      dataIndex: "name",
      key: "name",
    },
  ];

  return <Table columns={columns} dataSource={data} />;
};