@netang/quasar 0.0.102 → 0.0.103

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (162) hide show
  1. package/LICENSE +21 -21
  2. package/README.md +11 -11
  3. package/_docs/docs/.vuepress/client.js +8 -8
  4. package/_docs/docs/.vuepress/config.js +40 -40
  5. package/_docs/docs/.vuepress/configs/index.js +2 -2
  6. package/_docs/docs/.vuepress/configs/navbar/index.js +1 -1
  7. package/_docs/docs/.vuepress/configs/navbar/zh.js +16 -16
  8. package/_docs/docs/.vuepress/configs/sidebar/index.js +1 -1
  9. package/_docs/docs/.vuepress/configs/sidebar/zh.js +75 -75
  10. package/_docs/docs/.vuepress/public/css/index.css +3 -3
  11. package/_docs/docs/.vuepress/styles/index.scss +3 -3
  12. package/_docs/docs/components/column-title.md +25 -25
  13. package/_docs/docs/components/data.md +66 -66
  14. package/_docs/docs/components/dialog.md +59 -59
  15. package/_docs/docs/components/dragger.md +26 -26
  16. package/_docs/docs/components/editor-code.md +16 -16
  17. package/_docs/docs/components/empty.md +13 -13
  18. package/_docs/docs/components/field-date.md +16 -16
  19. package/_docs/docs/components/field-text.md +57 -57
  20. package/_docs/docs/components/field-tree.md +14 -14
  21. package/_docs/docs/components/img.md +25 -25
  22. package/_docs/docs/components/input-number.md +21 -21
  23. package/_docs/docs/components/list-menu-item.md +21 -21
  24. package/_docs/docs/components/list-menu.md +21 -21
  25. package/_docs/docs/components/power-page.md +21 -21
  26. package/_docs/docs/components/price.md +21 -21
  27. package/_docs/docs/components/render.md +12 -12
  28. package/_docs/docs/components/search-item.md +10 -10
  29. package/_docs/docs/components/search.md +12 -12
  30. package/_docs/docs/components/select.md +11 -11
  31. package/_docs/docs/components/splitter.md +15 -15
  32. package/_docs/docs/components/table-column-fixed.md +20 -20
  33. package/_docs/docs/components/table-pagination.md +20 -20
  34. package/_docs/docs/components/table-splitter.md +20 -20
  35. package/_docs/docs/components/table-summary.md +20 -20
  36. package/_docs/docs/components/table.md +25 -25
  37. package/_docs/docs/components/thumbnail.md +18 -18
  38. package/_docs/docs/components/toolbar.md +9 -9
  39. package/_docs/docs/components/uploader-query.md +19 -19
  40. package/_docs/docs/components/uploader.md +16 -16
  41. package/_docs/docs/components/value-format.md +26 -26
  42. package/_docs/docs/index.md +1 -1
  43. package/_docs/docs/utils/alert.md +26 -26
  44. package/_docs/docs/utils/area.md +112 -112
  45. package/_docs/docs/utils/arr.md +80 -80
  46. package/_docs/docs/utils/auth.md +101 -101
  47. package/_docs/docs/utils/bus.md +18 -18
  48. package/_docs/docs/utils/confirm.md +31 -31
  49. package/_docs/docs/utils/copy.md +22 -22
  50. package/_docs/docs/utils/dialog.md +98 -98
  51. package/_docs/docs/utils/dict.md +50 -50
  52. package/_docs/docs/utils/dictOptions.md +27 -27
  53. package/_docs/docs/utils/form.md +33 -33
  54. package/_docs/docs/utils/getData.md +60 -60
  55. package/_docs/docs/utils/getFile.md +21 -21
  56. package/_docs/docs/utils/getImage.md +33 -33
  57. package/_docs/docs/utils/getTime.md +51 -51
  58. package/_docs/docs/utils/index.md +1 -1
  59. package/_docs/docs/utils/loading.md +18 -18
  60. package/_docs/docs/utils/notify.md +29 -29
  61. package/_docs/docs/utils/power.md +353 -353
  62. package/_docs/docs/utils/previewImage.md +11 -11
  63. package/_docs/docs/utils/price.md +45 -45
  64. package/_docs/docs/utils/rule.md +30 -30
  65. package/_docs/docs/utils/ruleValid.md +31 -31
  66. package/_docs/docs/utils/symbols.md +30 -30
  67. package/_docs/docs/utils/table.md +194 -194
  68. package/_docs/docs/utils/timestamp.md +27 -27
  69. package/_docs/docs/utils/toast.md +27 -27
  70. package/_docs/docs/utils/tree.md +174 -174
  71. package/_docs/docs/utils/uploader.md +29 -29
  72. package/_docs/package.json +11 -11
  73. package/components/column-title/index.vue +37 -37
  74. package/components/data/index.vue +20 -20
  75. package/components/dialog/index.vue +372 -372
  76. package/components/dragger/index.vue +203 -203
  77. package/components/drawer/index.vue +303 -303
  78. package/components/editor-code/index.vue +289 -289
  79. package/components/empty/index.vue +71 -71
  80. package/components/field-date/index.vue +850 -850
  81. package/components/field-date/methods.js +100 -100
  82. package/components/field-table/index.vue +1222 -1222
  83. package/components/field-text/index.vue +165 -165
  84. package/components/field-tree/index.vue +103 -81
  85. package/components/img/index.vue +202 -202
  86. package/components/input-number/index.vue +546 -546
  87. package/components/list-menu/index.vue +149 -149
  88. package/components/list-menu-item/index.vue +79 -79
  89. package/components/power-page/index.vue +92 -92
  90. package/components/price/index.vue +188 -188
  91. package/components/private/components/index.js +11 -11
  92. package/components/private/components/move-to-tree/index.vue +154 -154
  93. package/components/private/edit-power-data/index.vue +816 -816
  94. package/components/private/table-visible-columns-button/index.vue +109 -109
  95. package/components/render/index.vue +150 -150
  96. package/components/search/index.vue +222 -222
  97. package/components/search-item/index.vue +210 -210
  98. package/components/splitter/index.vue +415 -415
  99. package/components/table/index.vue +456 -456
  100. package/components/table-column-fixed/index.vue +112 -112
  101. package/components/table-pagination/index.vue +192 -192
  102. package/components/table-splitter/index.vue +360 -360
  103. package/components/table-summary/index.vue +110 -110
  104. package/components/thumbnail/index.vue +72 -72
  105. package/components/toolbar/container.vue +31 -31
  106. package/components/toolbar/index.vue +136 -136
  107. package/components/uploader/index.vue +158 -158
  108. package/components/uploader-query/index.vue +758 -758
  109. package/components/value-format/index.vue +274 -274
  110. package/configs/area3.js +1 -1
  111. package/docs/css/index.css +3 -3
  112. package/package.json +1 -1
  113. package/sass/common.scss +174 -174
  114. package/sass/index.scss +14 -14
  115. package/sass/line.scss +39 -39
  116. package/sass/quasar/btn.scss +46 -46
  117. package/sass/quasar/common.scss +3 -3
  118. package/sass/quasar/dialog.scss +7 -7
  119. package/sass/quasar/drawer.scss +6 -6
  120. package/sass/quasar/field.scss +243 -243
  121. package/sass/quasar/loading.scss +6 -6
  122. package/sass/quasar/menu.scss +8 -8
  123. package/sass/quasar/table.scss +150 -150
  124. package/sass/quasar/toolbar.scss +22 -22
  125. package/store/index.js +29 -29
  126. package/utils/$auth.js +127 -127
  127. package/utils/$form.js +56 -56
  128. package/utils/$power.js +1215 -1215
  129. package/utils/$rule.js +13 -13
  130. package/utils/$ruleValid.js +10 -10
  131. package/utils/$table.js +999 -999
  132. package/utils/$tree.js +713 -713
  133. package/utils/alert.js +12 -12
  134. package/utils/area.js +400 -400
  135. package/utils/arr.js +51 -51
  136. package/utils/bus.js +6 -6
  137. package/utils/config.js +52 -52
  138. package/utils/confirm.js +11 -11
  139. package/utils/copy.js +30 -30
  140. package/utils/dialog.js +36 -36
  141. package/utils/dict.js +21 -21
  142. package/utils/dictOptions.js +28 -28
  143. package/utils/getData.js +73 -73
  144. package/utils/getFile.js +40 -40
  145. package/utils/getImage.js +153 -153
  146. package/utils/getTime.js +106 -106
  147. package/utils/index.js +61 -61
  148. package/utils/loading.js +15 -15
  149. package/utils/notify.js +13 -13
  150. package/utils/previewImage.js +10 -10
  151. package/utils/price.js +18 -18
  152. package/utils/symbols.js +18 -18
  153. package/utils/timestamp.js +18 -18
  154. package/utils/toast.js +13 -13
  155. package/utils/uploader/aliyun.js +6 -6
  156. package/utils/uploader/local.js +8 -8
  157. package/utils/uploader/qiniu.js +321 -321
  158. package/utils/uploader.js +1059 -1059
  159. package/utils/useAuth.js +30 -30
  160. package/utils/useRouter.js +47 -47
  161. package/utils/useSearch.js +0 -6
  162. package/utils/useUploader.js +53 -53
package/LICENSE CHANGED
@@ -1,21 +1,21 @@
1
- The MIT License (MIT)
2
-
3
- Copyright (c) 2022-present, Netang
4
-
5
- Permission is hereby granted, free of charge, to any person obtaining a copy
6
- of this software and associated documentation files (the "Software"), to deal
7
- in the Software without restriction, including without limitation the rights
8
- to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
- copies of the Software, and to permit persons to whom the Software is
10
- furnished to do so, subject to the following conditions:
11
-
12
- The above copyright notice and this permission notice shall be included in
13
- all copies or substantial portions of the Software.
14
-
15
- THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
- IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
- FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
- AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
- LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
- OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
21
- THE SOFTWARE.
1
+ The MIT License (MIT)
2
+
3
+ Copyright (c) 2022-present, Netang
4
+
5
+ Permission is hereby granted, free of charge, to any person obtaining a copy
6
+ of this software and associated documentation files (the "Software"), to deal
7
+ in the Software without restriction, including without limitation the rights
8
+ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
+ copies of the Software, and to permit persons to whom the Software is
10
+ furnished to do so, subject to the following conditions:
11
+
12
+ The above copyright notice and this permission notice shall be included in
13
+ all copies or substantial portions of the Software.
14
+
15
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
+ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
+ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
+ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
+ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
21
+ THE SOFTWARE.
package/README.md CHANGED
@@ -1,11 +1,11 @@
1
- ## Installation
2
-
3
- ```bash
4
- npm install @netang/quasar --save-dev
5
- ```
6
-
7
- ## License
8
-
9
- [MIT](https://opensource.org/licenses/MIT)
10
-
11
- Copyright (c) 2022-present, Netang
1
+ ## Installation
2
+
3
+ ```bash
4
+ npm install @netang/quasar --save-dev
5
+ ```
6
+
7
+ ## License
8
+
9
+ [MIT](https://opensource.org/licenses/MIT)
10
+
11
+ Copyright (c) 2022-present, Netang
@@ -1,8 +1,8 @@
1
- import { defineClientConfig } from '@vuepress/client'
2
-
3
-
4
- export default defineClientConfig({
5
- enhance({ app }) {
6
-
7
- },
8
- })
1
+ import { defineClientConfig } from '@vuepress/client'
2
+
3
+
4
+ export default defineClientConfig({
5
+ enhance({ app }) {
6
+
7
+ },
8
+ })
@@ -1,40 +1,40 @@
1
- import path from 'path'
2
- import { defineUserConfig } from '@vuepress/cli'
3
- import { defaultTheme } from '@vuepress/theme-default'
4
- import { searchPlugin } from '@vuepress/plugin-search'
5
-
6
- import {
7
- navbarZh,
8
- sidebarZh,
9
- } from './configs'
10
-
11
- export default defineUserConfig({
12
- // 站点的标题
13
- title: 'netang-quasar',
14
- // 部署站点的基础路径
15
- base: '/netang-quasar/',
16
- // 打包目录
17
- dest: path.join(__dirname, '../../../docs'),
18
- // 主题
19
- theme: defaultTheme({
20
- locales: {
21
- '/': {
22
- // navbar
23
- navbar: navbarZh,
24
- // sidebar
25
- sidebar: sidebarZh,
26
- },
27
- },
28
- }),
29
- // 插件
30
- plugins: [
31
- // 搜索
32
- searchPlugin({
33
- locales: {
34
- '/': {
35
- placeholder: '搜索',
36
- },
37
- },
38
- }),
39
- ],
40
- })
1
+ import path from 'path'
2
+ import { defineUserConfig } from '@vuepress/cli'
3
+ import { defaultTheme } from '@vuepress/theme-default'
4
+ import { searchPlugin } from '@vuepress/plugin-search'
5
+
6
+ import {
7
+ navbarZh,
8
+ sidebarZh,
9
+ } from './configs'
10
+
11
+ export default defineUserConfig({
12
+ // 站点的标题
13
+ title: 'netang-quasar',
14
+ // 部署站点的基础路径
15
+ base: '/netang-quasar/',
16
+ // 打包目录
17
+ dest: path.join(__dirname, '../../../docs'),
18
+ // 主题
19
+ theme: defaultTheme({
20
+ locales: {
21
+ '/': {
22
+ // navbar
23
+ navbar: navbarZh,
24
+ // sidebar
25
+ sidebar: sidebarZh,
26
+ },
27
+ },
28
+ }),
29
+ // 插件
30
+ plugins: [
31
+ // 搜索
32
+ searchPlugin({
33
+ locales: {
34
+ '/': {
35
+ placeholder: '搜索',
36
+ },
37
+ },
38
+ }),
39
+ ],
40
+ })
@@ -1,2 +1,2 @@
1
- export * from './navbar'
2
- export * from './sidebar'
1
+ export * from './navbar'
2
+ export * from './sidebar'
@@ -1 +1 @@
1
- export * from './zh'
1
+ export * from './zh'
@@ -1,16 +1,16 @@
1
- export const navbarZh = [
2
- {
3
- text: '首页',
4
- link: '/',
5
- },
6
- {
7
- text: '组件',
8
- activeMatch: '/components/',
9
- link: '/components/field-table',
10
- },
11
- {
12
- text: '工具',
13
- activeMatch: '/utils/',
14
- link: '/utils/auth',
15
- },
16
- ]
1
+ export const navbarZh = [
2
+ {
3
+ text: '首页',
4
+ link: '/',
5
+ },
6
+ {
7
+ text: '组件',
8
+ activeMatch: '/components/',
9
+ link: '/components/field-table',
10
+ },
11
+ {
12
+ text: '工具',
13
+ activeMatch: '/utils/',
14
+ link: '/utils/auth',
15
+ },
16
+ ]
@@ -1 +1 @@
1
- export * from './zh'
1
+ export * from './zh'
@@ -1,75 +1,75 @@
1
- export const sidebarZh = {
2
- '/components/': [
3
- {
4
- text: 'Components 组件',
5
- children: [
6
- '/components/column-title',
7
- '/components/data',
8
- '/components/dialog',
9
- '/components/dragger',
10
- '/components/editor-code',
11
- '/components/empty',
12
- '/components/field-date',
13
- '/components/field-table',
14
- '/components/field-text',
15
- '/components/field-tree',
16
- '/components/img',
17
- '/components/input-number',
18
- '/components/list-menu',
19
- '/components/list-menu-item',
20
- '/components/power-page',
21
- '/components/price',
22
- '/components/render',
23
- '/components/search',
24
- '/components/search-item',
25
- '/components/select',
26
- '/components/splitter',
27
- '/components/table',
28
- '/components/table-column-fixed',
29
- '/components/table-pagination',
30
- '/components/table-splitter',
31
- '/components/table-summary',
32
- '/components/thumbnail',
33
- '/components/toolbar',
34
- '/components/uploader',
35
- '/components/uploader-query',
36
- '/components/value-format',
37
- ],
38
- }
39
- ],
40
- '/utils/': [
41
- {
42
- text: 'Utils 工具',
43
- children: [
44
- '/utils/auth',
45
- '/utils/power',
46
- '/utils/table',
47
- '/utils/form',
48
- '/utils/tree',
49
- '/utils/rule',
50
- '/utils/ruleValid',
51
- '/utils/area',
52
- '/utils/alert',
53
- '/utils/arr',
54
- '/utils/bus',
55
- '/utils/confirm',
56
- '/utils/copy',
57
- '/utils/dialog',
58
- '/utils/dict',
59
- '/utils/dictOptions',
60
- '/utils/getData',
61
- '/utils/getFile',
62
- '/utils/getImage',
63
- '/utils/getTime',
64
- '/utils/loading',
65
- '/utils/notify',
66
- '/utils/previewImage',
67
- '/utils/price',
68
- '/utils/symbols',
69
- '/utils/timestamp',
70
- '/utils/toast',
71
- '/utils/uploader',
72
- ],
73
- }
74
- ],
75
- }
1
+ export const sidebarZh = {
2
+ '/components/': [
3
+ {
4
+ text: 'Components 组件',
5
+ children: [
6
+ '/components/column-title',
7
+ '/components/data',
8
+ '/components/dialog',
9
+ '/components/dragger',
10
+ '/components/editor-code',
11
+ '/components/empty',
12
+ '/components/field-date',
13
+ '/components/field-table',
14
+ '/components/field-text',
15
+ '/components/field-tree',
16
+ '/components/img',
17
+ '/components/input-number',
18
+ '/components/list-menu',
19
+ '/components/list-menu-item',
20
+ '/components/power-page',
21
+ '/components/price',
22
+ '/components/render',
23
+ '/components/search',
24
+ '/components/search-item',
25
+ '/components/select',
26
+ '/components/splitter',
27
+ '/components/table',
28
+ '/components/table-column-fixed',
29
+ '/components/table-pagination',
30
+ '/components/table-splitter',
31
+ '/components/table-summary',
32
+ '/components/thumbnail',
33
+ '/components/toolbar',
34
+ '/components/uploader',
35
+ '/components/uploader-query',
36
+ '/components/value-format',
37
+ ],
38
+ }
39
+ ],
40
+ '/utils/': [
41
+ {
42
+ text: 'Utils 工具',
43
+ children: [
44
+ '/utils/auth',
45
+ '/utils/power',
46
+ '/utils/table',
47
+ '/utils/form',
48
+ '/utils/tree',
49
+ '/utils/rule',
50
+ '/utils/ruleValid',
51
+ '/utils/area',
52
+ '/utils/alert',
53
+ '/utils/arr',
54
+ '/utils/bus',
55
+ '/utils/confirm',
56
+ '/utils/copy',
57
+ '/utils/dialog',
58
+ '/utils/dict',
59
+ '/utils/dictOptions',
60
+ '/utils/getData',
61
+ '/utils/getFile',
62
+ '/utils/getImage',
63
+ '/utils/getTime',
64
+ '/utils/loading',
65
+ '/utils/notify',
66
+ '/utils/previewImage',
67
+ '/utils/price',
68
+ '/utils/symbols',
69
+ '/utils/timestamp',
70
+ '/utils/toast',
71
+ '/utils/uploader',
72
+ ],
73
+ }
74
+ ],
75
+ }
@@ -1,3 +1,3 @@
1
- :root {
2
- --content-width: 1200px !important;
3
- }
1
+ :root {
2
+ --content-width: 1200px !important;
3
+ }
@@ -1,3 +1,3 @@
1
- body {
2
- --content-width: 1200px !important;
3
- }
1
+ body {
2
+ --content-width: 1200px !important;
3
+ }
@@ -1,25 +1,25 @@
1
- # ColumnTitle 栏目标题
2
-
3
- ::: tip
4
- **栏目标题**
5
-
6
- 用于显示一个撑满一行的栏目标题
7
- :::
8
-
9
- ## 使用示例
10
-
11
- ### 基础示例
12
-
13
- ```html
14
- <!-- 栏目标题 -->
15
- <n-column-title label="订单信息" />
16
- ```
17
-
18
- ## ColumnTitle API
19
-
20
- ### ColumnTitle 属性
21
-
22
- | 属性名 | 说明 | 类型 | 可选值 | 默认值 |
23
- |---------|------|---------------------|-----|-----|
24
- | label | 标签 | `String` / `Number` | - | - |
25
- | tooltip | 提示信息 | `String` / `Number` | - | - |
1
+ # ColumnTitle 栏目标题
2
+
3
+ ::: tip
4
+ **栏目标题**
5
+
6
+ 用于显示一个撑满一行的栏目标题
7
+ :::
8
+
9
+ ## 使用示例
10
+
11
+ ### 基础示例
12
+
13
+ ```html
14
+ <!-- 栏目标题 -->
15
+ <n-column-title label="订单信息" />
16
+ ```
17
+
18
+ ## ColumnTitle API
19
+
20
+ ### ColumnTitle 属性
21
+
22
+ | 属性名 | 说明 | 类型 | 可选值 | 默认值 |
23
+ |---------|------|---------------------|-----|-----|
24
+ | label | 标签 | `String` / `Number` | - | - |
25
+ | tooltip | 提示信息 | `String` / `Number` | - | - |
@@ -1,66 +1,66 @@
1
- # Data 数据插槽
2
-
3
- ::: tip
4
- 数据插槽
5
- :::
6
-
7
- ## 使用示例
8
-
9
- ### 基础示例
10
-
11
- ```html
12
- <n-data :data="{ name: '张三', age: 23 }" v-slot="{ data }">
13
- <div>姓名: {{ data.name }}</div>
14
- <div>年龄: {{ data.age }}</div>
15
- </n-data>
16
- ```
17
-
18
- ### 复杂示例
19
-
20
- ```html
21
- <template>
22
- <n-data
23
- v-for="userId in userIds"
24
- :key="`data-item-${userId}`"
25
- :data="userAll[userId]"
26
- v-slot="{ data: userItem }"
27
- >
28
- <div>姓名: {{ userItem.name }},年龄: {{ userItem.age }}</div>
29
- </n-data>
30
- </template>
31
-
32
- <script>
33
- export default {
34
- setup() {
35
- return {
36
- userIds: [11, 22, 33],
37
- userAll: {
38
- 11: { id: 11, name: '张三', age: 23 },
39
- 22: { id: 22, name: '李四', age: 33 },
40
- 33: { id: 33, name: '王五', age: 26 },
41
- },
42
- }
43
- }
44
- }
45
- </script>
46
- ```
47
-
48
- ## Data API
49
-
50
- ### Data 属性
51
-
52
- | 属性名 | 说明 | 类型 | 可选值 | 默认值 |
53
- |------|-----|-----|-----|-----|
54
- | data | 数据 | - | - | - |
55
-
56
- ### Data 插槽
57
-
58
- | 插槽名 | 说明 |
59
- |---------|------|
60
- | default | 默认插槽 |
61
-
62
- ### Data `default` 插槽 对外暴露的方法
63
-
64
- | 属性名 | 说明 | 类型 | 示例 |
65
- |------|-----|-----|-----|
66
- | data | 数据 | - | - |
1
+ # Data 数据插槽
2
+
3
+ ::: tip
4
+ 数据插槽
5
+ :::
6
+
7
+ ## 使用示例
8
+
9
+ ### 基础示例
10
+
11
+ ```html
12
+ <n-data :data="{ name: '张三', age: 23 }" v-slot="{ data }">
13
+ <div>姓名: {{ data.name }}</div>
14
+ <div>年龄: {{ data.age }}</div>
15
+ </n-data>
16
+ ```
17
+
18
+ ### 复杂示例
19
+
20
+ ```html
21
+ <template>
22
+ <n-data
23
+ v-for="userId in userIds"
24
+ :key="`data-item-${userId}`"
25
+ :data="userAll[userId]"
26
+ v-slot="{ data: userItem }"
27
+ >
28
+ <div>姓名: {{ userItem.name }},年龄: {{ userItem.age }}</div>
29
+ </n-data>
30
+ </template>
31
+
32
+ <script>
33
+ export default {
34
+ setup() {
35
+ return {
36
+ userIds: [11, 22, 33],
37
+ userAll: {
38
+ 11: { id: 11, name: '张三', age: 23 },
39
+ 22: { id: 22, name: '李四', age: 33 },
40
+ 33: { id: 33, name: '王五', age: 26 },
41
+ },
42
+ }
43
+ }
44
+ }
45
+ </script>
46
+ ```
47
+
48
+ ## Data API
49
+
50
+ ### Data 属性
51
+
52
+ | 属性名 | 说明 | 类型 | 可选值 | 默认值 |
53
+ |------|-----|-----|-----|-----|
54
+ | data | 数据 | - | - | - |
55
+
56
+ ### Data 插槽
57
+
58
+ | 插槽名 | 说明 |
59
+ |---------|------|
60
+ | default | 默认插槽 |
61
+
62
+ ### Data `default` 插槽 对外暴露的方法
63
+
64
+ | 属性名 | 说明 | 类型 | 示例 |
65
+ |------|-----|-----|-----|
66
+ | data | 数据 | - | - |