@opentiny/vue-docs 2.2.6 → 2.2.7

package/demos/pc/app/transfer/basic-usage.spec.ts

@@ -5,87 +5,82 @@ test('基本用法', async ({ page }) => {
   await page.goto('transfer#basic-usage')
   const preview = page.locator('.pc-demo-container')
   // 穿梭框按钮
-  const buttons = preview.getByRole('button')
-  // 穿梭框面板
   const transferPanels = preview.locator('.tiny-transfer-panel')
-  // 左侧面板
-  const leftPanel = transferPanels.first()
-  // 右侧面板
+  const leftPanel = transferPanels.nth(0)
   const rightPanel = transferPanels.nth(1)
 
-  // 向左交换按钮应该为禁用状态
-  await expect(buttons.first()).toBeDisabled()
-  // 向右交换按钮应该为禁用状态
-  await expect(buttons.nth(1)).toBeDisabled()
+  const buttons = preview.getByRole('button')
+  const toRightBtn = buttons.nth(0)
+  const toLeftBtn = buttons.nth(1)
+
+  // 0、初始时，交换按钮应该为禁用状态
+  await expect(toRightBtn).toBeDisabled()
+  await expect(toLeftBtn).toBeDisabled()
 
-  // 从左侧面板选择多个备用项，交换至右侧面板
+  // 1、从左交换至右
   let labels = leftPanel.locator('label').filter({ hasText: '备选项 2' }).locator('span')
   // 选中"备选项2"
   await labels.nth(1).click()
-  // 判断是否有类名"is-checked"
   await expect(labels.first()).toHaveClass(/is-checked/)
+  await page.waitForTimeout(10)
 
-  labels = leftPanel.locator('label').filter({ hasText: '备选项 3' }).locator('span')
   // 选中"备选项3"
+  labels = leftPanel.locator('label').filter({ hasText: '备选项 3' }).locator('span')
   await labels.nth(1).click()
-  // 判断是否有类名"is-checked"
   await expect(labels.first()).toHaveClass(/is-checked/)
+  await page.waitForTimeout(10)
 
-  // 复选框
+  // 复选框应该为半选状态
   let checkbox = leftPanel.getByRole('paragraph').filter({ hasText: '列表 1 2 / 14' }).getByRole('checkbox')
-  // 应该为半选状态
   await expect(checkbox).toHaveClass(/is-indeterminate/)
-  // 向左侧交换的按钮应该为可用状态
-  await expect(buttons.first()).toBeEnabled()
-  // 向右侧交换的按钮应该为不可用状态
-  await expect(buttons.nth(1)).toBeDisabled()
-  // 最后点击向左侧交换按钮
-  await buttons.first().click()
-
-  // 右侧面板应该出现"备选项2"
+  // 按钮可用状态
+  await expect(toRightBtn).toBeEnabled()
+  await expect(toLeftBtn).toBeDisabled()
+
+  // 点击向左侧交换按钮
+  await toRightBtn.click()
+  await page.waitForTimeout(10)
+
+  // 检查右侧面板
   await expect(rightPanel.locator('label').filter({ hasText: '备选项 2' })).toHaveCount(1)
-  // 右侧面板应该出现"备选项3"
   await expect(rightPanel.locator('label').filter({ hasText: '备选项 3' })).toHaveCount(1)
-  // 向左侧交换的按钮应该为不可用状态
-  await expect(buttons.first()).toBeDisabled()
-  // 向右侧交换的按钮应该为不可用状态
-  await expect(buttons.nth(1)).toBeDisabled()
+  await expect(toRightBtn).toBeDisabled()
+  await expect(toLeftBtn).toBeDisabled()
+  await page.waitForTimeout(10)
+
+  // 2、从右交换至左
 
-  // 从右侧面板选择多个备用项，交换至左侧面板
-  labels = rightPanel.locator('label').filter({ hasText: '备选项 2' }).locator('span')
   // 选中"备选项2"
+  labels = rightPanel.locator('label').filter({ hasText: '备选项 2' }).locator('span')
   await labels.nth(1).click()
-  // 判断是否有类名"is-checked"
   await expect(labels.first()).toHaveClass(/is-checked/)
 
-  labels = page.locator('label').filter({ hasText: '备选项 3' }).locator('span')
   // 选中"备选项3"
+  labels = page.locator('label').filter({ hasText: '备选项 3' }).locator('span')
   await labels.nth(1).click()
-  // 判断是否有类名"is-checked"
   await expect(labels.first()).toHaveClass(/is-checked/)
+  await page.waitForTimeout(10)
 
-  // 复选框
+  // 复选框应该为半选状态
   checkbox = rightPanel.getByRole('paragraph').filter({ hasText: '列表 2 2 / 4' }).getByRole('checkbox')
-  // 应该为半选状态
   await expect(checkbox).toHaveClass(/is-indeterminate/)
-  // 向左侧交换的按钮应该为不可用状态
-  await expect(buttons.first()).toBeDisabled()
-  // 向右侧交换的按钮应该为可用状态
-  await expect(buttons.nth(1)).toBeEnabled()
+
+  // 按钮可用状态
+  await expect(toRightBtn).toBeDisabled()
+  await expect(toLeftBtn).toBeEnabled()
+
   // 点击向左侧交换按钮
-  await buttons.nth(1).click()
+  await toLeftBtn.click()
+  await page.waitForTimeout(10)
 
-  // 左侧面板应该出现"备选项2"
+  // 检查左侧面板
   await expect(leftPanel.locator('label').filter({ hasText: '备选项 2' })).toHaveCount(1)
-  // 左侧面板应该出现"备选项3"
   await expect(leftPanel.locator('label').filter({ hasText: '备选项 3' })).toHaveCount(1)
-  // 向左侧交换的按钮应该为不可用状态
-  await expect(buttons.first()).toBeDisabled()
-  // 向右侧交换的按钮应该为不可用状态
-  await expect(buttons.nth(1)).toBeDisabled()
+  await expect(toRightBtn).toBeDisabled()
+  await expect(toLeftBtn).toBeDisabled()
 
   // 全选
-  await leftPanel.locator('.tiny-checkbox__input').first().click()
-  // 显示的选中数量应该为 11
+  const allCheckbox = leftPanel.locator('.tiny-checkbox__input').first()
+  await allCheckbox.click()
   await expect(preview.getByRole('paragraph').filter({ hasText: '列表 1 11 / 14' })).toHaveCount(1)
 })

package/demos/pc/app/transfer/before-transfer.spec.ts

@@ -0,0 +1,28 @@
+import { test, expect } from '@playwright/test'
+
+test('基本用法', async ({ page }) => {
+  page.on('pageerror', (exception) => expect(exception).toBeNull())
+  await page.goto('transfer#basic-usage')
+  const preview = page.locator('.pc-demo-container')
+  // 穿梭框按钮
+  const transferPanels = preview.locator('.tiny-transfer-panel')
+  const leftPanel = transferPanels.nth(0)
+  const rightPanel = transferPanels.nth(1)
+
+  const buttons = preview.getByRole('button')
+  const toRightBtn = buttons.nth(0)
+
+  // 1、从左交换至右
+  let labels = leftPanel.locator('label').filter({ hasText: '备选项 2' }).locator('span')
+  // 选中"备选项2"
+  await labels.nth(1).click()
+  await expect(labels.first()).toHaveClass(/is-checked/)
+  await page.waitForTimeout(10)
+
+  // 点击向左侧交换按钮
+  await toRightBtn.click()
+  await page.waitForTimeout(10)
+
+  await page.waitForTimeout(2100)
+  await expect(rightPanel.locator('label').filter({ hasText: '备选项 2' })).toHaveCount(1)
+})

package/demos/pc/app/transfer/custom-btns.spec.ts

@@ -14,7 +14,7 @@ test('自定义按钮测试', async ({ page }) => {
   await expect(buttons.first()).toBeEnabled()
   await expect(buttons.nth(3)).toBeEnabled()
 
-  //全部移动到右侧
+  // 全部移动到右侧
   await buttons.first().click()
   await expect(rightPanel.locator('label').filter({ hasText: '列表 2 0 / 13' })).toHaveCount(1)
   await expect(buttons.first()).toBeDisabled()

package/demos/pc/app/transfer/custom-filter-composition-api.vue

@@ -1,16 +1,20 @@
 <template>
-  <tiny-transfer
-    v-model="value"
-    :data="data"
-    filterable
-    :filter-method="filterMethod"
-    filter-placeholder="请输入城市拼音"
-  ></tiny-transfer>
+  <div>
+    <tiny-button style="margin-bottom: 20px" @click="clearQuery">重置查询</tiny-button>
+    <tiny-transfer
+      ref="transferRef"
+      v-model="value"
+      :data="data"
+      filterable
+      :filter-method="filterMethod"
+      filter-placeholder="请输入城市拼音"
+    ></tiny-transfer>
+  </div>
 </template>
 
 <script setup lang="jsx">
 import { ref } from 'vue'
-import { Transfer as TinyTransfer } from '@opentiny/vue'
+import { Transfer as TinyTransfer, Button as TinyButton } from '@opentiny/vue'
 
 const generateData = () => {
   const data = []
@@ -30,8 +34,13 @@ const generateData = () => {
 
 const data = ref(generateData())
 const value = ref([1, 4])
+const transferRef = ref()
 
 function filterMethod(query, item) {
   return item.pinyin.includes(query)
 }
+function clearQuery() {
+  transferRef.value.clearQuery('left')
+  transferRef.value.clearQuery('right')
+}
 </script>

package/demos/pc/app/transfer/custom-filter.vue

@@ -1,19 +1,24 @@
 <template>
-  <tiny-transfer
-    v-model="value"
-    :data="data"
-    filterable
-    :filter-method="filterMethod"
-    filter-placeholder="请输入城市拼音"
-  ></tiny-transfer>
+  <div>
+    <tiny-button style="margin-bottom: 20px" @click="clearQuery">重置查询</tiny-button>
+    <tiny-transfer
+      ref="transferRef"
+      v-model="value"
+      :data="data"
+      filterable
+      :filter-method="filterMethod"
+      filter-placeholder="请输入城市拼音"
+    ></tiny-transfer>
+  </div>
 </template>
 
 <script lang="jsx">
-import { Transfer } from '@opentiny/vue'
+import { Transfer, Button } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyTransfer: Transfer
+    TinyTransfer: Transfer,
+    TinyButton: Button
   },
   data() {
     const generateData = () => {
@@ -40,6 +45,10 @@ export default {
   methods: {
     filterMethod(query, item) {
       return item.pinyin.includes(query)
+    },
+    clearQuery() {
+      this.$refs.transferRef.clearQuery('left')
+      this.$refs.transferRef.clearQuery('right')
     }
   }
 }

package/demos/pc/app/transfer/custom-render-composition-api.vue

@@ -41,7 +41,7 @@ const value = ref([1, 4])
 function renderDataItem(h, option) {
   return (
     <span>
-      <span class="red">{option.id}</span> - {option.text}- by jsx
+      <span class="red">{option.id}</span> - {option.text} - by jsx
     </span>
   )
 }

package/demos/pc/app/transfer/custom-render.spec.ts

@@ -5,8 +5,9 @@ test('判断是否可以选中自定义数据项', async ({ page }) => {
   await page.goto('transfer#custom-render')
 
   const preview = page.locator('.pc-demo-container')
-  const jsxNode = preview.getByText('备选项 2 -by jsx')
+  const jsxNode = preview.getByText('备选项 2 - by jsx')
   const slotNode = preview.getByText('备选项 2 - by slot')
+
   await expect(jsxNode).toHaveCount(1)
   await expect(slotNode).toHaveCount(1)
 })

package/demos/pc/app/transfer/custom-render.vue

@@ -49,7 +49,7 @@ export default {
     renderDataItem(h, option) {
       return (
         <span>
-          <span class="red">{option.id}</span> - {option.text} -by jsx
+          <span class="red">{option.id}</span> - {option.text} - by jsx
         </span>
       )
     }

package/demos/pc/app/transfer/custom-titles.spec.ts

@@ -10,5 +10,12 @@ test('自定义列表标题', async ({ page }) => {
   const rightPanel = transferPanels.nth(1)
 
   await expect(leftPanel.locator('.tiny-checkbox__label').first()).toHaveText(/所有数据列表/)
+  await expect(leftPanel.locator('.tiny-checkbox__label').first()).toHaveText(/未勾选 \/ 共14/)
   await expect(rightPanel.locator('.tiny-checkbox__label').first()).toHaveText(/已选数据列表/)
+  await expect(rightPanel.locator('.tiny-checkbox__label').first()).toHaveText(/未勾选 \/ 共2/)
+
+  // 全选
+  const allCheckbox = leftPanel.locator('.tiny-checkbox__input').first()
+  await allCheckbox.click()
+  await expect(leftPanel.locator('.tiny-checkbox__label').first()).toHaveText(/已选择11 \/ 共14/)
 })

package/demos/pc/app/transfer/drop-config.spec.ts

@@ -22,7 +22,7 @@ test('尝试拖拽', async ({ page }) => {
   await expect(rightPanel.locator('.tiny-transfer-panel__header').filter({ hasText: '列表 2 0 / 5' })).toHaveCount(1)
   await expect(leftPanel.locator('.tiny-transfer-panel__header').filter({ hasText: '列表 1 0 / 11' })).toHaveCount(1)
 
-  //尝试拖拽右侧某一项至左侧面板
+  // 尝试拖拽右侧某一项至左侧面板
   const dragDiv2 = rightPanel.locator('label').filter({ hasText: '备选项 3' })
   await page.waitForTimeout(100)
   await dragDiv2.hover()

package/demos/pc/app/transfer/nested-table.spec.ts

@@ -14,7 +14,7 @@ test('判断数据交换', async ({ page }) => {
   await expect(rightPanel.getByText('列表 2 1 / 8')).toHaveCount(1)
   await page.waitForTimeout(50)
 
-  //判断是否可以将右侧数据交换到左侧面板
+  // 判断是否可以将右侧数据交换到左侧面板
   await preview.locator('.defaultButton > button:nth-child(2)').click()
   await expect(leftPanel.getByText('列表 1 0 / 13')).toHaveCount(1)
   await page.waitForTimeout(50)

package/demos/pc/app/transfer/webdoc/transfer.js

@@ -88,13 +88,15 @@ export default {
           组件支持显示一个输入框，去过滤显示在左右列表的数据项。<br>
           通过 <code>filterable</code> 属性开启左右侧列表的搜索功能，默认是根据label内容过滤。<br>
           通过 <code>filter-placeholder</code> 属性自定义左右搜索框占位符。<br>
-          通过 <code>filter-method</code> 钩子函数，可自定义左右列表搜索的方法。
+          通过 <code>filter-method</code> 钩子函数，可自定义左右列表搜索的方法。<br>
+          调用 <code>clearQuery()</code> 方法,可清空左右侧列表的搜索框，参数为 left 或者 right 。<br>
         `,
         'en-US': `
           At the top of the left and right lists, you can display an input field to filter the data items that display the left and right lists. <br>
           Use the <code>filterable</code> attribute to enable the search function of the left and right lists, which by default filter based on the label content. <br>
           Use the <code>filter-placeholder</code> attribute to define the placeholder for the left and right search boxes. <br>
-          The <code>filter-method</code> hook allows you to customize the way you search the left and right lists.
+          The <code>filter-method</code> hook allows you to customize the way you search the left and right lists.<br>
+          The <code>clearQuery()</code> method clears the search box in the left and right lists with either the left or right arguments.<br>
         `
       },
       'codeFiles': ['custom-filter.vue']
@@ -114,7 +116,6 @@ export default {
       },
       'codeFiles': ['default-checked.vue']
     },
-
     {
       'demoId': 'drop-config',
       'name': { 'zh-CN': '可拖拽', 'en-US': 'Drag left and right' },
@@ -136,16 +137,7 @@ export default {
       },
       'codeFiles': ['target-order.vue']
     },
-    {
-      'demoId': 'manual-clear-query',
-      'name': { 'zh-CN': '手动清空搜索框', 'en-US': 'Clear the search box manually' },
-      'desc': {
-        'zh-CN': '调用 <code>clearQuery()</code> 方法可清空左右侧列表的搜索框，参数为 left 或者 right 。',
-        'en-US':
-          'The <code>clearQuery()</code> method clears the search box in the left and right lists with either the left or right arguments.'
-      },
-      'codeFiles': ['manual-clear-query.vue']
-    },
+
     {
       'demoId': 'before-transfer',
       'name': { 'zh-CN': '穿梭拦截', 'en-US': 'Clear the search box manually' },
@@ -208,7 +200,7 @@ export default {
           'demoId': 'basic-usage'
         },
         {
-          'name': 'modelValue',
+          'name': 'v-model / modelValue',
           'type': 'string[]',
           'defaultValue': '[]',
           'desc': {
@@ -280,6 +272,7 @@ export default {
           'name': 'format',
           'type': 'object',
           'defaultValue':
+            // eslint-disable-next-line no-template-curly-in-string
             "{ <br>&nbsp; noChecked:'${checked}/${total}', <br>&nbsp; hasChecked: '${checked}/${total}' <br>}",
           'desc': { 'zh-CN': '列表顶部勾选状态文案', 'en-US': 'Check the status copy at the top of the list' },
           'demoId': 'custom-titles'
@@ -525,7 +518,7 @@ export default {
           'type': '(name: string) => void',
           'defaultValue': '',
           'desc': { 'zh-CN': '清空某个面板的搜索关键词', 'en-US': 'Clear the search keywords of a panel.' },
-          'demoId': 'manual-clear-query'
+          'demoId': 'custom-filter'
         }
       ]
     }

package/demos/pc/app/tree/filter-view-composition-api.vue

@@ -28,10 +28,11 @@
       :show-auxi="showAuxi === 'show'"
     >
       <!-- 屏蔽默认的后缀图标 -->
-      <template #suffix="{ node }"> <div></div> </template>
+      <template #suffix> <div></div> </template>
     </tiny-tree>
   </div>
 </template>
+
 <script setup lang="jsx">
 import { ref } from 'vue'
 import { Tree as TinyTree, RadioGroup as TinyRadioGroup, Radio as TinyRadio, Input as TinyInput } from '@opentiny/vue'
@@ -62,9 +63,10 @@ const data = ref([
 ])
 
 function inputChange() {
-  treeRef.value.filter(this.filterText)
+  treeRef.value.filter(filterText.value)
 }
 
+// eslint-disable-next-line unused-imports/no-unused-vars
 function filterNodeMethod(text, data, node) {
   return data.label.includes(text)
 }

package/demos/pc/app/tree/filter-view.vue

@@ -28,7 +28,7 @@
       :show-auxi="showAuxi === 'show'"
     >
       <!-- 屏蔽默认的后缀图标 -->
-      <template #suffix="{ node }"> <div></div> </template>
+      <template #suffix> <div></div> </template>
     </tiny-tree>
   </div>
 </template>
@@ -74,6 +74,7 @@ export default {
     inputChange() {
       this.$refs.treeRef.filter(this.filterText)
     },
+    // eslint-disable-next-line unused-imports/no-unused-vars
     filterNodeMethod(text, data, node) {
       return data.label.includes(text)
     }

package/demos/pc/app/tree/icons-composition-api.vue

@@ -3,10 +3,10 @@
     <tiny-tree :data="data" :icon="icon"></tiny-tree>
     <tiny-tree
       :data="data"
-      :expandIcon="expandIcon"
-      expandIconColor="red"
-      :shrinkIcon="shrinkIcon"
-      shrinkIconColor="blue"
+      :expand-icon="expandIcon"
+      expand-icon-color="red"
+      :shrink-icon="shrinkIcon"
+      shrink-icon-color="blue"
     ></tiny-tree>
   </div>
 </template>

package/demos/pc/app/tree/icons.vue

@@ -3,10 +3,10 @@
     <tiny-tree :data="data" :icon="icon"></tiny-tree>
     <tiny-tree
       :data="data"
-      :expandIcon="expandIcon"
-      expandIconColor="red"
-      :shrinkIcon="shrinkIcon"
-      shrinkIconColor="blue"
+      :expand-icon="expandIcon"
+      expand-icon-color="red"
+      :shrink-icon="shrinkIcon"
+      shrink-icon-color="blue"
     ></tiny-tree>
   </div>
 </template>

package/demos/pc/app/tree/lazy-composition-api.vue

@@ -1,15 +1,15 @@
 <template>
   <div>
-    <tiny-tree lazy :load="load" :afterLoad="afterLoad" @load-data="loadedData"></tiny-tree>
+    <tiny-tree lazy :load="load" :after-load="afterLoad" @load-data="loadedData"></tiny-tree>
   </div>
 </template>
 
 <script setup lang="jsx">
-import { ref } from 'vue'
 import { Tree as TinyTree } from '@opentiny/vue'
 
+// node为点击的节点， resolve为回调函数，用于异步返回下层节点的数据
 function load(node, resolve) {
-  // node为点击的节点， resolve为回调函数，用于异步返回下层节点的数据
+  // eslint-disable-next-line no-console
   console.log('即将加载节点下级数据：', node)
 
   // 通过 level =0 来识别第一次加载
@@ -37,9 +37,11 @@ function load(node, resolve) {
   }
 }
 function afterLoad(data) {
+  // eslint-disable-next-line no-console
   console.log('afterLoad属性触发：', data)
 }
 function loadedData(data) {
+  // eslint-disable-next-line no-console
   console.log('load-data 事件触发：', data)
 }
 </script>

package/demos/pc/app/tree/lazy.vue

@@ -1,6 +1,6 @@
 <template>
   <div>
-    <tiny-tree lazy :load="load" :afterLoad="afterLoad" @load-data="loadedData"></tiny-tree>
+    <tiny-tree lazy :load="load" :after-load="afterLoad" @load-data="loadedData"></tiny-tree>
   </div>
 </template>
 
@@ -12,8 +12,9 @@ export default {
     TinyTree: Tree
   },
   methods: {
+    // node为点击的节点， resolve为回调函数，用于异步返回下层节点的数据
     load(node, resolve) {
-      // node为点击的节点， resolve为回调函数，用于异步返回下层节点的数据
+      // eslint-disable-next-line no-console
       console.log('即将加载节点下级数据：', node)
 
       // 通过 level =0 来识别第一次加载
@@ -41,9 +42,11 @@ export default {
       }
     },
     afterLoad(data) {
+      // eslint-disable-next-line no-console
       console.log('afterLoad属性触发：', data)
     },
     loadedData(data) {
+      // eslint-disable-next-line no-console
       console.log('load-data 事件触发：', data)
     }
   }

package/demos/pc/app/tree/radio-composition-api.vue

@@ -1,3 +1,4 @@
+<!-- eslint-disable unused-imports/no-unused-vars -->
 <template>
   <div>
     <div class="node-tip">在开发者控制台中查看它的打印信息：</div>
@@ -22,6 +23,7 @@ import { ref } from 'vue'
 import { Tree as TinyTree, Button as TinyButton } from '@opentiny/vue'
 
 const treeRef = ref()
+const defaultRadioKey = ref(['1-1'])
 const data = ref([
   {
     id: '1',
@@ -44,8 +46,6 @@ const data = ref([
 ])
 
 function getChecks() {
-  const currentKey = treeRef.value.getCurrentKey()
-
   // 查询勾选的值
   const checkedKeys = treeRef.value.getCheckedKeys()
   // 查询勾选叶子的值
@@ -59,6 +59,7 @@ function getChecks() {
   // 查询半选的节点数据
   const checkedHalfNodes = treeRef.value.getHalfCheckedNodes()
 
+  // eslint-disable-next-line no-console
   console.log('当前组件的勾选状态为： ', treeRef.value, {
     checkedKeys,
     checkedKeysOnlyLeaf,
@@ -69,12 +70,13 @@ function getChecks() {
   })
 }
 function setCurrentRadio() {
-  this.defaultRadioKey = ['3-1']
-  this.$refs.treeRef.setCurrentRadio()
+  defaultRadioKey.value = ['3-1']
+  treeRef.value.setCurrentRadio()
 }
 
 function checkChange(data, checked, indeterminate) {
-  console.log('checkChange事件：', arguments)
+  // eslint-disable-next-line no-console
+  console.log('checkChange事件：', { data, checked, indeterminate })
 }
 </script>
 

package/demos/pc/app/tree/radio.vue

@@ -52,8 +52,6 @@ export default {
   },
   methods: {
     getChecks() {
-      const currentKey = this.$refs.treeRef.getCurrentKey()
-
       // 查询勾选的值
       const checkedKeys = this.$refs.treeRef.getCheckedKeys()
       // 查询勾选叶子的值
@@ -67,6 +65,7 @@ export default {
       // 查询半选的节点数据
       const checkedHalfNodes = this.$refs.treeRef.getHalfCheckedNodes()
 
+      // eslint-disable-next-line no-console
       console.log('当前组件的勾选状态为： ', this.$refs.treeRef, {
         checkedKeys,
         checkedKeysOnlyLeaf,
@@ -81,7 +80,8 @@ export default {
       this.$refs.treeRef.setCurrentRadio()
     },
     checkChange(data, checked, indeterminate) {
-      console.log('checkChange事件：', arguments)
+      // eslint-disable-next-line no-console
+      console.log('checkChange事件：', { data, checked, indeterminate })
     }
   }
 }