@opentiny/vue-docs 2.2.6 → 2.2.7

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

@@ -68,7 +68,7 @@ export default {
             'en-US':
               'The row group attribute can be configured. Columns with the same value are displayed in a row group.'
           },
-          'demoId': 'grid-row-grouping#row-grouping'
+          'demoId': 'grid-row-grouping#row-grouping-row-grouping'
         },
         {
           'name': 'toolbar',
@@ -81,7 +81,7 @@ export default {
         {
           'name': 'align',
           'type': `'left' | 'center' | 'right'`,
-          'defaultValue': 'left',
+          'defaultValue': `'left'`,
           'desc': {
             'zh-CN': '所有的列对齐方式;该属性的可选值为 left（左对齐）, center（居中对齐）, right（右对齐）',
             'en-US':
@@ -202,7 +202,7 @@ export default {
         {
           'name': 'footer-align',
           'type': `'left' | 'center' | 'right'`,
-          'defaultValue': '继承 align',
+          'defaultValue': `'left'`,
           'desc': {
             'zh-CN': '所有的表尾列的对齐方式;该属性的可选值为 left（左对齐）, center（居中对齐）, right（右对齐）',
             'en-US':
@@ -265,8 +265,8 @@ export default {
         },
         {
           'name': 'header-align',
-          'type': 'string',
-          'defaultValue': '继承 align',
+          'type': `'left' | 'center' | 'right'`,
+          'defaultValue': `'left'`,
           'desc': {
             'zh-CN': '所有的表头列的对齐方式;该属性的可选值为 left（左对齐）, center（居中对齐）, right（右对齐）',
             'en-US':
@@ -376,7 +376,7 @@ export default {
           'type': 'VueComponent',
           'defaultValue': '--',
           'desc': { 'zh-CN': '自定义表格loading', 'en-US': 'Whether the table is being loaded.' },
-          'demoId': 'grid-loading#grid-custom-loading'
+          'demoId': 'grid-loading#loading-grid-custom-loading'
         },
         {
           'name': 'max-height',
@@ -456,7 +456,7 @@ export default {
         {
           'name': 'row-id',
           'type': 'string',
-          'defaultValue': '_RID',
+          'defaultValue': `'_RID'`,
           'desc': {
             'zh-CN': '自定义行数据唯一主键的字段名（行数据必须要有唯一主键，默认自动生成）',
             'en-US':
@@ -485,7 +485,7 @@ export default {
         {
           'name': 'show-header',
           'type': 'boolean',
-          'defaultValue': 'false',
+          'defaultValue': 'true',
           'desc': { 'zh-CN': '是否显示表头', 'en-US': 'Whether to display the table header' },
           'demoId': 'grid-header#header-hide-grid-header'
         },
@@ -550,7 +550,7 @@ export default {
           'name': 'span-method',
           'type': '(args: ISpanMethodArgs) => { rowspan: number, colspan: number }',
           'typeAnchorName': 'ISpanMethodArgs',
-          'defaultValue': '{ rowspan: 1, colspan: 1}',
+          'defaultValue': '{ rowspan: 1, colspan: 1 }',
           'desc': {
             'zh-CN': '合并行或列，该函数返回计算后的值',
             'en-US': 'Consolidate rows or columns. This function returns the calculated value.'
@@ -855,10 +855,10 @@ export default {
             'zh-CN': '用于单选行，手动清空用户的选择',
             'en-US': 'This is used to select a single row. Manually clear the user selection.'
           },
-          'demoId': 'grid-operation-column#operation-column-default-serial-column'
+          'demoId': 'grid-operation-column#operation-column-clear-and-set-radio-row'
         },
         {
-          'name': 'clearRowExpand()',
+          'name': 'clearRowExpand',
           'type': '()=> void',
           'defaultValue': '--',
           'desc': {
@@ -1021,7 +1021,7 @@ export default {
             'zh-CN': '获取表格的可视列，也可以指定索引获取列',
             'en-US': 'Obtains the visual column of the table or specifies the index to obtain the column.'
           },
-          'demoId': 'grid-dynamically-columns#dynamically-columns-columns-dynamic'
+          'demoId': 'grid-custom#custom-server-storage'
         },
         {
           'name': 'getCurrentRow',
@@ -1219,7 +1219,7 @@ export default {
             'en-US':
               'Inserts one or more rows into a table. Second parameter: row specified position (tree tables are not supported), null inserted from the first row, and –1 inserted from the last row'
           },
-          'demoId': 'grid-toolbar#toolbar-insert-delete-update'
+          'demoId': 'grid-toolbar#toolbar-insert-remove-rows'
         },
         {
           'name': 'loadColumn',
@@ -1275,7 +1275,7 @@ export default {
             'en-US':
               'Data data is refreshed synchronously. If this method is used, the component does not record the status of adding, deleting, and modifying, and can only implement the corresponding logic. (This parameter may be used in some special scenarios, for example, when a node element in a deep tree changes.)'
           },
-          'demoId': 'grid-tree-grid#tree-table-tree-grid-insert-delete-update'
+          'demoId': 'grid-tree-table#tree-table-tree-grid-insert-delete-update'
         },
         {
           'name': 'reloadCustoms',
@@ -1423,14 +1423,14 @@ export default {
           'demoId': 'grid-tree-table#tree-table-set-tree-expansion'
         },
         {
-          'name': 'setCurrentRow(row)',
+          'name': 'setCurrentRow',
           'type': '(row: IRow)=> Promise',
           'defaultValue': '--',
           'desc': {
             'zh-CN': '用于当前行，设置某一行为高亮状态',
             'en-US': 'Sets the highlight status of a row for the current row.'
           },
-          'demoId': 'grid-highlight#highlight-highlight-hover-row'
+          'demoId': 'grid-highlight#highlight-set-current-row'
         },
         {
           'name': 'setRadioRow',
@@ -1525,7 +1525,7 @@ export default {
             'zh-CN': '用于可树形表格，切换展开树形节点',
             'en-US': 'This parameter is used to switch and expand tree nodes in a tree table.'
           },
-          'demoId': 'grid-expand#expand-set-row-expansion'
+          'demoId': 'grid-expand#expand-set-tree-expansion'
         },
         {
           'name': 'validate',
@@ -1574,7 +1574,7 @@ export default {
             'en-US':
               'This event is valid only when toolbar.buttons are configured. This event is triggered when a toolbar button is clicked'
           },
-          'demoId': 'grid-toolbar#toolbar-insert-delete-update'
+          'demoId': 'grid-event#event-toolbar-button-click-event'
         },
         {
           'name': 'cell-click',
@@ -1585,7 +1585,7 @@ export default {
             'zh-CN': '单元格被点击时会触发该事件',
             'en-US': 'This event is triggered when a cell is clicked'
           },
-          'demoId': 'grid-event#event-cell-click-event'
+          'demoId': 'grid-event#event-click-event'
         },
         {
           'name': 'cancel-page-change',
@@ -1618,7 +1618,7 @@ export default {
             'zh-CN': '单元格被双击时会触发该事件',
             'en-US': 'This event is triggered when a cell is double-clicked'
           },
-          'demoId': 'grid-event#event-cell-click-event'
+          'demoId': 'grid-event#event-click-event'
         },
         {
           'name': 'cell-mouseenter',
@@ -1675,7 +1675,7 @@ export default {
             'zh-CN': '单元格被激活编辑时会触发该事件',
             'en-US': 'This event is triggered when a cell is activated for editing'
           },
-          'demoId': 'grid-event#event-edit-actived-event'
+          'demoId': 'grid-event#event-edit-event'
         },
         {
           'name': 'edit-closed',
@@ -1686,7 +1686,7 @@ export default {
             'zh-CN': '单元格编辑状态下被关闭时会触发该事件',
             'en-US': 'This event is triggered when a cell is closed in the editing state'
           },
-          'demoId': 'grid-event#event-edit-actived-event'
+          'demoId': 'grid-event#event-edit-event'
         },
         {
           'name': 'edit-disabled',
@@ -1697,7 +1697,7 @@ export default {
             'zh-CN': '当单元格激活时如果是禁用状态时会触发该事件',
             'en-US': 'This event is triggered when a cell is activated and is disabled'
           },
-          'demoId': 'grid-event#event-edit-actived-event'
+          'demoId': 'grid-event#event-edit-event'
         },
         {
           'name': 'filter-change',
@@ -1940,7 +1940,7 @@ export default {
         {
           'name': 'footer-align',
           'type': `'left' | 'center' | 'right'`,
-          'defaultValue': '继承 align > 继承 table 的 footer-align',
+          'defaultValue': `'left'`,
           'desc': {
             'zh-CN': '表尾列的对齐方式;该属性的可选值为 left（左对其）, center（居中对其）, right（右对齐）',
             'en-US':
@@ -1962,7 +1962,7 @@ export default {
         {
           'name': 'header-align',
           'type': "'left' | 'center' | 'right'",
-          'defaultValue': '继承 align > 继承 table 的 header-align',
+          'defaultValue': `'left'`,
           'desc': {
             'zh-CN': '表头列的对齐方式;该属性的可选值为 left（左对其）, center（居中对其）, right（右对齐）',
             'en-US':
@@ -2331,7 +2331,7 @@ export default {
             'zh-CN': '列宽拖动配置（需要设置 id）',
             'en-US': 'Column width dragging configuration (id needs to be set)'
           },
-          'demoId': 'grid-customized#custom-column-width'
+          'demoId': 'grid-custom#custom-column-width'
         },
         {
           'name': 'setting',
@@ -2415,7 +2415,7 @@ export default {
             'zh-CN': '当工具栏的按钮被点击时会后触发该事件',
             'en-US': 'This event is triggered when a button on the toolbar is clicked'
           },
-          'demoId': 'grid-event#event-toolbar-button-click-event'
+          'demoId': 'grid-validation#validation-before-submit-validation'
         },
         {
           'name': 'save-setting',
@@ -2450,16 +2450,6 @@ export default {
             'en-US': 'Click the Reset button on the personalized panel to trigger the event.'
           },
           'demoId': 'grid-custom#custom-ordercolumn-local'
-        },
-        {
-          'name': 'on-before-move',
-          'type': `(type: 'column' | 'row', row: IRow)=> boolean`,
-          'defaultValue': '--',
-          'desc': {
-            'zh-CN': '个性化面板拖拽前事件',
-            'en-US': 'event before the personalized panel is dragged'
-          },
-          'demoId': 'grid-custom#custom-prsonalized-drag'
         }
       ]
     }

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

@@ -45,7 +45,7 @@ export default {
     {
       'name': 'hrapprover',
       'type': 'component',
-      'properties': [
+      'props': [
         {
           'name': 'value',
           'type': 'string ',

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

@@ -155,7 +155,7 @@ export default {
             'en-US':
               'After lazy loading is enabled, the container listens for the scroll event. The default value of this property is the parent element of the last overflow value being auto or scroll'
           },
-          'demoId': 'lazy'
+          'demoId': ''
         },
         {
           'name': 'preview-src-list',
@@ -172,7 +172,7 @@ export default {
             'zh-CN': '设置图片预览外层元素的 z-index',
             'en-US': 'Set the z-index of the image preview wrapper'
           },
-          'demoId': 'preview'
+          'demoId': ''
         }
       ],
       'events': [

package/demos/pc/app/infinite-scroll/basic-usage.spec.ts

@@ -0,0 +1,11 @@
+import { test, expect } from '@playwright/test'
+
+test('基础用法', async ({ page }) => {
+  page.on('pageerror', (exception) => expect(exception).toBeNull())
+  await page.goto('infinite-scroll#basic-usage')
+  const infiniteList = page.locator('#basic-usage .tiny-infinite-list')
+  const infiniteListChild = infiniteList.locator('.tiny-infinite-list-item')
+  await expect(infiniteList).toBeVisible()
+  await expect(infiniteListChild.nth(0)).toBeVisible()
+  await expect(infiniteListChild.nth(0)).toHaveText('1')
+})

package/demos/pc/app/infinite-scroll/disabled.spec.ts

@@ -0,0 +1,10 @@
+import { test, expect } from '@playwright/test'
+
+test('禁用加载', async ({ page }) => {
+  page.on('pageerror', (exception) => expect(exception).toBeNull())
+  await page.goto('infinite-scroll#disabled')
+  const infiniteList = page.locator('#disabled .tiny-infinite-list-wrapper')
+  await expect(infiniteList.locator('.list')).not.toBeVisible()
+  await page.waitForTimeout(400)
+  await expect(infiniteList.locator('.list')).toBeVisible()
+})

package/demos/pc/app/infinite-scroll/webdoc/infinite-scroll.cn.md

@@ -4,4 +4,4 @@ title: Infinite Scroll 无限滚动
 
 # Infinite Scroll 无限滚动
 
-<div>滚动至容器底部时，加载更多数据</div>
+<div>滚动至容器底部时，加载更多数据。</div>

package/demos/pc/app/infinite-scroll/webdoc/infinite-scroll.js

@@ -6,7 +6,8 @@ export default {
       'demoId': 'basic-usage',
       'name': { 'zh-CN': '基本用法', 'en-US': 'Basic Usage' },
       'desc': {
-        'zh-CN': '<p>要实现滚动加载，需要在列表上添加指令 <code>v-infinite-scroll</code> 并指定加载方法，参考示例</p>\n',
+        'zh-CN':
+          '<p>要实现滚动加载，需要在列表上添加指令 <code>v-infinite-scroll</code> 并指定加载方法，参考示例。</p>\n',
         'en-US':
           '<p>To implement rolling loading, you need to add the directive <code>v-infinite-scroll</code> to the list and specify the loading method. For details, see the example. </p>\n'
       },
@@ -16,7 +17,7 @@ export default {
       'demoId': 'disabled',
       'name': { 'zh-CN': '禁用加载', 'en-US': 'Disabling loading' },
       'desc': {
-        'zh-CN': '<p>在滚动加载列表上添加属性 <code>infinite-scroll-disabled</code> 控制是否禁用加载，参考示例</p>\n',
+        'zh-CN': '<p>在滚动加载列表上添加属性 <code>infinite-scroll-disabled</code> 控制是否禁用加载，参考示例。</p>\n',
         'en-US':
           '<p>Adds the property <code>infinite-scroll-disabled</code> to the scrolling load list to control whether loading is disabled. For details, see the example. </p>\n'
       },
@@ -27,22 +28,21 @@ export default {
     {
       'name': 'infinite-scroll',
       'type': 'directive',
-      'properties': [
+      'props': [
         {
           'name': 'v-infinite-scroll',
           'type': 'Function',
           'defaultValue': '',
           'desc': {
-            'zh-CN': "无限滚动加载指令，指定加载方法",
-            'en-US':
-              "Infinite roll load instruction, specifying the load method."
+            'zh-CN': '无限滚动加载指令，指定加载方法',
+            'en-US': 'Infinite roll load instruction, specifying the load method.'
           },
           'demoId': 'basic-usage'
         },
         {
           'name': 'infinite-scroll-disabled',
           'type': 'boolean',
-          'defaultValue': '该属性的默认值为 false',
+          'defaultValue': 'false',
           'desc': {
             'zh-CN': '是否禁用滚动',
             'en-US': 'Whether to disable scrolling. '
@@ -52,19 +52,20 @@ export default {
         {
           'name': 'infinite-scroll-immediate',
           'type': 'boolean',
-          'defaultValue': '该属性的默认值为 true',
+          'defaultValue': 'true',
           'desc': {
-            'zh-CN': '是否立即加载，以防初始状态下内容无法撑满容器。',
-            'en-US': 'Indicates whether to load the container immediately to prevent the container from being full in the initial state.'
+            'zh-CN': '是否立即加载，以防初始状态下内容无法撑满容器',
+            'en-US':
+              'Indicates whether to load the container immediately to prevent the container from being full in the initial state.'
           },
           'demoId': ''
         },
         {
           'name': 'infinite-scroll-delay',
           'type': 'number',
-          'defaultValue': '该属性的默认值为 200',
+          'defaultValue': '200',
           'desc': {
-            'zh-CN': '加载延时，单位为 ms。',
+            'zh-CN': '加载延时，单位为 ms',
             'en-US': 'Loading delay, the unit is millisecond.'
           },
           'demoId': ''
@@ -72,15 +73,14 @@ export default {
         {
           'name': 'infinite-scroll-distance',
           'type': 'number',
-          'defaultValue': '该属性的默认值为 0',
+          'defaultValue': '0',
           'desc': {
-            'zh-CN': '加载触发距离阈值，单位为 px。',
-            'en-US':
-              'Threshold of the load triggering distance,the unit is px. '
+            'zh-CN': '加载触发距离阈值，单位为 px',
+            'en-US': 'Threshold of the load triggering distance,the unit is px. '
           },
           'demoId': ''
-        },
-      ],
+        }
+      ]
     }
   ]
 }

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

@@ -250,7 +250,7 @@ export default {
             'en-US':
               'The right offset of the child item is offset via the left property; it is recommended to use offset instead'
           },
-          'demoId': 'offset'
+          'demoId': ''
         },
         {
           'name': 'xs',

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

@@ -61,7 +61,7 @@ export default {
     {
       'name': 'link',
       'type': 'component',
-      'properties': [
+      'props': [
         {
           'name': 'type',
           'type': "'primary' | 'success' | 'warning' | 'danger' | 'info'",

package/demos/pc/app/link-menu/custom-foot.spec.ts

@@ -3,7 +3,7 @@ import { test, expect } from '@playwright/test'
 test('自定义菜单弹窗底部', async ({ page }) => {
   page.on('pageerror', (exception) => expect(exception).toBeNull())
   await page.goto('link-menu#custom-foot')
-  const preview = page.locator('#preview')
+  const preview = page.locator('#custom-foot')
   const dialogBox = preview.locator('.tiny-dialog-box')
   const linkMenuList = preview.locator('.tiny-tree.tiny-link-menu__overflow > div')
   // 点击图标，弹出弹框

package/demos/pc/app/link-menu/custom-icon.spec.ts

@@ -4,27 +4,12 @@ test.describe('以下2个测试将覆盖2个demo: 自定义折叠展开图标、
   test('自定义折叠展开图标', async ({ page }) => {
     page.on('pageerror', (exception) => expect(exception).toBeNull())
     await page.goto('link-menu#custom-icon')
-    const preview = page.locator('#preview')
     // 点击图标弹出对话框
-    await preview.getByRole('button').click()
-    const linkMenuList = preview.locator('.tiny-tree.tiny-link-menu__overflow > div')
-    const filterIcon = preview.locator('.tiny-link-menu__filert .tiny-input__icon')
+    const linkMenuList = page.locator('.tiny-tree.tiny-link-menu__overflow > div')
+    const filterIcon = page.locator('.tiny-link-menu__filert .tiny-input__icon')
     // 默认搜索图标的path数量为1
     await expect(filterIcon.locator('path')).toHaveCount(3)
     // 默认展开图标的path数量为1
     await expect(linkMenuList.nth(1).locator('.tree-node-icon .tiny-tree-node__expand-icon path')).toHaveCount(2)
   })
-
-  test('菜单内容超长时省略显示', async ({ page }) => {
-    page.on('pageerror', (exception) => expect(exception).toBeNull())
-    await page.goto('link-menu#custom-icon1')
-    const preview = page.locator('#preview')
-    // 点击图标弹出对话框
-    await preview.getByRole('button').click()
-    const linkMenuList = preview.locator('.tiny-tree.tiny-link-menu__overflow > div')
-    const firstOption = linkMenuList.first()
-    await expect(firstOption.locator('.tree-node-name')).toHaveCSS('overflow', 'hidden')
-    await expect(firstOption.locator('.tree-node-name')).toHaveCSS('text-overflow', 'ellipsis')
-    await expect(firstOption.locator('.tree-node-name')).toHaveCSS('white-space', 'nowrap')
-  })
 })

package/demos/pc/app/link-menu/data-resource.spec.ts

@@ -4,19 +4,12 @@ test.describe('以下3个测试将覆盖3个demo: 数据源、收藏菜单标题
   test('弹框功能是否正常', async ({ page }) => {
     page.on('pageerror', (exception) => expect(exception).toBeNull())
     await page.goto('link-menu#data-resource')
-    const preview = page.locator('#preview')
-    const dialogBox = preview.locator('.tiny-dialog-box')
+    const dialogBox = page.locator('.tiny-dialog-box')
     // 点击图标弹出对话框
-    await preview.getByRole('button').click()
+    await page.locator('#data-resource').getByRole('button').click()
     // 弹框应该可见
     await expect(dialogBox).toBeVisible()
     // 关闭弹框
-    await page.getByRole('button', { name: 'Close' }).click()
-    // 弹框应该不可见
-    await expect(dialogBox).toBeHidden()
-    // 点击图标弹出对话框
-    await preview.getByRole('button').click()
-    // 点击取消按钮
     await page.getByRole('button', { name: '取消' }).click()
     // 弹框应该不可见
     await expect(dialogBox).toBeHidden()
@@ -24,13 +17,12 @@ test.describe('以下3个测试将覆盖3个demo: 数据源、收藏菜单标题
 
   test('菜单内容超长时换行显示、收藏菜单标题', async ({ page }) => {
     page.on('pageerror', (exception) => expect(exception).toBeNull())
-    await page.goto('link-menu#data-resource2')
-    const preview = page.locator('#preview')
-    const dialogBox = preview.locator('.tiny-dialog-box')
-    const dialogBoxTitle = preview.locator('.tiny-dialog-box__header .tiny-dialog-box__title')
-    const linkMenuList = preview.locator('.tiny-tree.tiny-link-menu__wrap > div')
+    await page.goto('link-menu#data-resource')
+    const dialogBox = page.locator('.tiny-dialog-box')
+    const dialogBoxTitle = page.locator('.tiny-dialog-box__header .tiny-dialog-box__title')
+    const linkMenuList = page.locator('.tiny-tree.tiny-link-menu__wrap > div')
     // 点击图标弹出对话框
-    await preview.getByRole('button').click()
+    await page.locator('#data-resource').getByRole('button').click()
     // 弹框应该可见
     await expect(dialogBox).toBeVisible()
     // 自定义标题
@@ -40,9 +32,8 @@ test.describe('以下3个测试将覆盖3个demo: 数据源、收藏菜单标题
   })
 
   test('是否可以选中菜单项并展示', async ({ page }) => {
-    page.on('pageerror', (exception) => expect(exception).toBeNull())
-    await page.goto('link-menu#data-resource1')
-    const preview = page.locator('#preview')
+    await page.goto('link-menu#data-resource')
+    const preview = page.locator('#data-resource')
     const dialogBox = preview.locator('.tiny-dialog-box')
     const linkMenuList = preview.locator('.tiny-tree.tiny-link-menu__wrap > div')
     // 点击图标弹出对话框

package/demos/pc/app/link-menu/get-menu-data-sync.spec.ts

@@ -3,7 +3,7 @@ import { test, expect } from '@playwright/test'
 test('自定义菜单数据服务', async ({ page }) => {
   page.on('pageerror', (exception) => expect(exception).toBeNull())
   await page.goto('link-menu#get-menu-data-sync')
-  const preview = page.locator('#preview')
+  const preview = page.locator('#get-menu-data-sync')
   const dialogBox = preview.locator('.tiny-dialog-box')
   const linkMenuList = preview.locator('.tiny-tree.tiny-link-menu__overflow > div')
   // 点击图标弹出对话框

package/demos/pc/app/link-menu/menu-items.spec.ts

@@ -3,7 +3,7 @@ import { test, expect } from '@playwright/test'
 test('可收藏栏目数', async ({ page }) => {
   page.on('pageerror', (exception) => expect(exception).toBeNull())
   await page.goto('link-menu#menu-items')
-  const preview = page.locator('#preview')
+  const preview = page.locator('#menu-items')
   const dialogBox = preview.locator('.tiny-dialog-box')
   const linkMenuList = preview.locator('.tiny-tree.tiny-link-menu__overflow > div')
   // 点击图标弹出对话框

package/demos/pc/app/link-menu/webdoc/link-menu.js

@@ -2,36 +2,16 @@ export default {
   column: '2',
   owner: '',
   demos: [
-    {
-      'demoId': 'data-resource1',
-      'name': { 'zh-CN': '数据源', 'en-US': 'Data Source' },
-      'desc': {
-        'zh-CN':
-          '<p>通过 <code>data</code> 属性设置菜单的数据源，同时在数据对象中可通过 <code>disabled</code> 设置该节点是否可被勾选。</p>\n',
-        'en-US':
-          '<p>Set the data source of the menu through the <code>data</code> attribute. In addition, you can set whether the node can be selected through <code>disabled</code> in the data object. </p>\n'
-      },
-      'codeFiles': ['data-resource.vue']
-    },
     {
       'demoId': 'data-resource',
-      'name': { 'zh-CN': '收藏菜单标题', 'en-US': 'Collection Menu Title' },
+      'name': { 'zh-CN': '菜单设置', 'en-US': 'Data Source' },
       'desc': {
-        'zh-CN': '<p>通过 <code>title</code> 属性定义收藏菜单标题。</p>\n',
-        'en-US': '<p>The <code>title</code> attribute defines the title of the favorites menu. </p>\n'
-      },
-      'codeFiles': ['data-resource.vue']
-    },
-    {
-      'demoId': 'data-resource2',
-      'name': {
-        'zh-CN': '菜单内容超长时换行显示',
-        'en-US': 'The menu content is displayed in a new line when it is too long.'
-      },
-      'desc': {
-        'zh-CN': '<p>通过 <code>wrap</code> 属性设置菜单内容超长时换行显示。</p>\n',
-        'en-US':
-          '<p>The <code>wrap</code> attribute is used to set the menu content to be displayed in a line wrap when the menu content is too long. </p>\n'
+        'zh-CN': `<p>通过 <code>data</code> 属性设置菜单的数据源，同时在数据对象中可通过 <code>disabled</code> 设置该节点是否可被勾选。</p>\n
+          <p>通过 <code>title</code> 属性定义收藏菜单标题。</p>\n
+          <p>通过 <code>wrap</code> 属性设置菜单内容超长时换行显示。</p>\n`,
+        'en-US': `<p>Set the data source of the menu through the <code>data</code> attribute. In addition, you can set whether the node can be selected through <code>disabled</code> in the data object. </p>\n
+          <p>The <code>title</code> attribute defines the title of the favorites menu. </p>\n
+          <p>The <code>wrap</code> attribute is used to set the menu content to be displayed in a line wrap when the menu content is too long. </p>\n`
       },
       'codeFiles': ['data-resource.vue']
     },
@@ -92,7 +72,7 @@ export default {
     {
       'name': 'link-menu',
       'type': 'component',
-      'properties': [
+      'props': [
         {
           'name': 'data',
           'type': 'Array',

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

@@ -62,8 +62,7 @@ export default {
       'demoId': 'fullscreen',
       'name': { 'zh-CN': '全屏加载', 'en-US': 'Fullscreen Loading' },
       'desc': {
-        'zh-CN':
-          `<p>
+        'zh-CN': `<p>
             <div>通过 <code>v-loading.lock.fullscreen</code> 指令添加修饰符进行全屏加载</div>
             <div>也能通过<code>Loading.service</code>并配置属性进行全屏加载</div>
           </p>`,
@@ -105,8 +104,7 @@ export default {
           'defaultValue': 'true',
           'desc': {
             'zh-CN': '属性为 true 显示全屏，同 v-loading 指令中的 fullscreen 修饰符',
-            'en-US':
-              'Set true to display the full screen. Same as the fullscreen modifier in the v-loading instruction'
+            'en-US': 'Set true to display the full screen. Same as the fullscreen modifier in the v-loading instruction'
           },
           'demoId': 'fullscreen'
         },
@@ -169,7 +167,7 @@ export default {
           'desc': { 'zh-CN': 'Loading 的自定义类名', 'en-US': 'User-defined loading class name' },
           'demoId': 'custom-class'
         }
-      ],
+      ]
     },
     {
       'name': 'loading',
@@ -226,8 +224,7 @@ export default {
           'desc': {
             'zh-CN': '命令修饰符：遮罩层是否在body上',
             'en-US': 'Command modifier: Whether the mask is on the body'
-          },
-          'demoId': 'fullscreen'
+          }
         },
         {
           'name': 'lock',
@@ -237,8 +234,8 @@ export default {
             'en-US': 'Command modifier: Whether to lock scroll in full screen'
           },
           'demoId': 'fullscreen'
-        },
-      ],
+        }
+      ]
     }
   ]
 }

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

@@ -38,7 +38,7 @@ export default {
     {
       'name': 'locales',
       'type': 'component',
-      'properties': [
+      'props': [
         {
           'name': 'local',
           'type': 'boolean',