diff --git a/docs/zh/ecosystem-d2-crud/README.md b/docs/zh/ecosystem-d2-crud/README.md index daf1527d..9dcab931 100644 --- a/docs/zh/ecosystem-d2-crud/README.md +++ b/docs/zh/ecosystem-d2-crud/README.md @@ -31,4 +31,4 @@ new Vue({ }) ``` -之后就可以在项目中使用`D2-Crud`了,具体使用方法请参考 [使用指南](./api.md) +之后就可以在项目中使用`D2-Crud`了。具体使用方法请参考 [示例](./example.md) diff --git a/docs/zh/ecosystem-d2-crud/api.md b/docs/zh/ecosystem-d2-crud/api.md index a97ef9a7..59327929 100644 --- a/docs/zh/ecosystem-d2-crud/api.md +++ b/docs/zh/ecosystem-d2-crud/api.md @@ -1,3 +1 @@ -# 使用指南 - -## 基础表格 +# API diff --git a/docs/zh/ecosystem-d2-crud/example.md b/docs/zh/ecosystem-d2-crud/example.md new file mode 100644 index 00000000..a0bad423 --- /dev/null +++ b/docs/zh/ecosystem-d2-crud/example.md @@ -0,0 +1,5 @@ +# 示例 + +| 示例 | 代码与演示 | +| --- | --- | +| 基础表格 | [点我查看](https://fairyever.gitee.io//d2-admin-preview/#/demo/d2-crud/demo1) | diff --git a/src/menu/modules/demo-d2-crud.js b/src/menu/modules/demo-d2-crud.js index 8da7f9ad..42675a0c 100644 --- a/src/menu/modules/demo-d2-crud.js +++ b/src/menu/modules/demo-d2-crud.js @@ -4,6 +4,6 @@ export default { icon: 'table', children: (pre => [ { path: `${pre}index`, title: 'D2 CRUD 首页', icon: 'home' }, - { path: `${pre}demo1`, title: '基本表格' } + { path: `${pre}demo1`, title: '基础表格' } ])('/demo/d2-crud/') } diff --git a/src/pages/demo/d2-crud/demo1/code.js b/src/pages/demo/d2-crud/demo1/code.js new file mode 100644 index 00000000..9302b8fd --- /dev/null +++ b/src/pages/demo/d2-crud/demo1/code.js @@ -0,0 +1,54 @@ +export default ` + + + + + +` diff --git a/src/pages/demo/d2-crud/demo1/index.vue b/src/pages/demo/d2-crud/demo1/index.vue index 52a07b4b..d2bde819 100644 --- a/src/pages/demo/d2-crud/demo1/index.vue +++ b/src/pages/demo/d2-crud/demo1/index.vue @@ -1,11 +1,17 @@ - 基本表格 + 基础表格 - + :data="data"/> + + + 在d2-crud元素中注入columns和data对象数组,即可创建一个最基础的表格,可以在columns对象中传入width属性来控制列宽。代码如下: + + + + + @@ -13,17 +19,22 @@
+ 在d2-crud元素中注入columns和data对象数组,即可创建一个最基础的表格,可以在columns对象中传入width属性来控制列宽。代码如下: +