Browse Source

fix(cell): demo 文档展示逻辑修改

richard1015 3 years ago
parent
commit
7f0df8c1c5

+ 7 - 1
src/packages/__VUE/cell/demo.vue

@@ -55,7 +55,11 @@
     </nut-cell-group>
 
     <h2>{{ translate('displayIcon') }}</h2>
-    <nut-cell :title="translate('name')" :desc="translate('desc')" isLink> </nut-cell>
+    <nut-cell :title="translate('name')" :desc="translate('desc')" isLink>
+      <template v-slot:icon>
+        <My />
+      </template>
+    </nut-cell>
     <h2>{{ translate('title6') }}</h2>
     <nut-cell desc-text-align="left" :desc="translate('desc')"></nut-cell>
 
@@ -69,6 +73,7 @@ import { ref } from 'vue';
 import { createComponent } from '@/packages/utils/create';
 const { createDemo, translate } = createComponent('cell');
 import { useTranslate } from '@/sites/assets/util/useTranslate';
+import { My } from '@nutui/icons-vue';
 const initTranslate = () =>
   useTranslate({
     'zh-CN': {
@@ -121,6 +126,7 @@ const initTranslate = () =>
     }
   });
 export default createDemo({
+  components: { My },
   setup() {
     initTranslate();
     const testClick = (event: Event) => {

+ 14 - 1
src/packages/__VUE/cell/doc.en-US.md

@@ -159,8 +159,21 @@ app.use(CellGroup);
 
 ```html
 <template>
-  <nut-cell title="Name" icon="my" desc="Description"></nut-cell>
+  <nut-cell title="Name" desc="Description">
+      <template v-slot:icon>
+        <My />
+      </template>
+  </nut-cell>
 </template>
+<script lang="ts">
+import { My } from '@nutui/icons-vue';
+export default {
+  components: { My },
+  setup() {
+    return { My };
+  }
+};
+</script>
 ```
 
 :::

+ 14 - 1
src/packages/__VUE/cell/doc.md

@@ -163,8 +163,21 @@ app.use(CellGroup);
 
 ```html
 <template>
-  <nut-cell title="姓名" desc="张三"></nut-cell>
+  <nut-cell title="姓名" desc="张三">
+    <template v-slot:icon>
+        <My />
+      </template>
+  </nut-cell>
 </template>
+<script lang="ts">
+import { My } from '@nutui/icons-vue';
+export default {
+  components: { My },
+  setup() {
+    return { My };
+  }
+};
+</script>
 ```
 
 :::

+ 7 - 1
src/sites/mobile-taro/vue/src/basic/pages/cell/index.vue

@@ -53,7 +53,11 @@
     </nut-cell-group>
 
     <h2>展示图标</h2>
-    <nut-cell title="姓名" icon="my" desc="张三" isLink> </nut-cell>
+    <nut-cell title="姓名" icon="my" desc="张三" isLink>
+      <template v-slot:icon>
+        <My />
+      </template>
+    </nut-cell>
     <h2>只展示 desc ,可通过 desc-text-align 调整内容位置</h2>
     <nut-cell desc-text-align="left" desc="张三"></nut-cell>
     <h2>垂直居中</h2>
@@ -63,7 +67,9 @@
 
 <script lang="ts">
 import { ref } from 'vue';
+import { My } from '@nutui/icons-vue-taro';
 export default {
+  components: { My },
   setup() {
     const testClick = (event: Event) => {
       // console.log('点击事件');