轮播图修改4

src/Manager/components/Carousel.vue

@@ -8,7 +8,7 @@
         </a-space>
     </div>
 
-    <a-table :row-selection="rowSelection" :columns="columns"  :data-source="states.data" :pagination="pagination" :scroll="{ x:0,y: 430}" style="width: 85vw;">
+    <a-table :row-selection="rowSelection"  :rowKey="record => record.id" :columns="columns"  :data-source="states.data"  :pagination="pagination"  style="width: 84vw;">
 
 
         <template #bodyCell="{ column, record }">
@@ -158,7 +158,7 @@ const showAddModal = () => {
 // // 翻页
 const pagination = computed(() => ({
   total: states.data.length,
-  pageSize: 10,
+  pageSize: 5,
 }));
 
 
@@ -169,54 +169,54 @@ const columns = [
         dataIndex: 'author',
         key: 'author',
         resizable: true,
-        width: 100,
-        minWidth: 100,
-        maxWidth: 200,
+        // width: 100,
+        // minWidth: 100,
+        // maxWidth: 200,
     },
     {
         title:'图片',
         key: 'photo',
         dataIndex: 'photo',
         resizable: true,
-        width: 150,
-        maxWidth: 150,
+        // width: 150,
+        // maxWidth: 150,
 
     },
     {
         title: '标题',
         dataIndex: 'title',
         key: 'title',
-        width:150,
-        maxWidth: 150,
+        // width:150,
+        // maxWidth: 150,
     },
     {
         title: '创建时间',
         dataIndex: 'createdAt',
         key: 'createdAt',
-        width:200,
-        maxWidth: 200,
-    },
-    {
-        title: '图片地址',
-        dataIndex: 'image',
-        key: 'image',
-        width:250,
-        maxWidth: 250
-
+        // width:200,
+        // maxWidth: 200,
     },
+    // {
+    //     title: '图片地址',
+    //     dataIndex: 'image',
+    //     key: 'image',
+    //     width:250,
+    //     maxWidth: 250
+    //
+    // },
     {
         title: '排序',
         dataIndex: 'displayOrder',
         key: 'displayOrder',
         width:80,
-        maxWidth: 80,
+        // maxWidth: 80,
     },
     {
         title: '状态',
         key: 'isActive',
         dataIndex: 'isActive',
-        width: 80,
-        maxWidth: 80,
+        // width: 80,
+        // maxWidth: 80,
     },
     {
         title: '操作',
@@ -363,14 +363,24 @@ const formState = reactive({
     isActive: false,
 });
 
+// const rowSelection = {
+//     onChange: (selectedRowKeys, selectedRows) => {
+//         console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows);
+//     },
+//     getCheckboxProps: record => ({
+//         disabled: record.name === 'Disabled User',
+//         checked: record.id
+//     }),
+// };
+
+
 const rowSelection = {
     onChange: (selectedRowKeys, selectedRows) => {
         console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows);
     },
-    getCheckboxProps: record => ({
-        disabled: record.name === 'Disabled User',
-        // Column configuration not to be checked
-        name: record.name,
+    getCheckboxProps: (record) => ({
+        // 设置每行选择框的属性
+        checked: record.id
     }),
 };