Browse Source

docs: 校验Divider组件taro文档和demo

yangjinjun3 2 years ago
parent
commit
cb4f0721f6

+ 1 - 1
jd/generate-taro-route.cjs

@@ -35,7 +35,7 @@ const create = async () => {
     `
 const subPackages = ${JSON.stringify(subpackages, null, 2)};\n
 export default {
-  pages: ['pages/index/index', 'pages/index/layout'],
+  pages: ['pages/index/index'],
   subPackages,
   window: {
     backgroundTextStyle: 'light',

+ 5 - 5
src/packages/__VUE/actionsheet/demo.vue

@@ -5,19 +5,19 @@
       <span
         ><label>{{ translate('basic') }}</label></span
       >
-      <div class="selected-option" v-html="state.val1"></div>
+      <div v-html="state.val1"></div>
     </nut-cell>
     <nut-cell :showIcon="true" :isLink="true" @click="switchActionSheet('isVisible2')">
       <span
         ><label>{{ translate('showCancelButton') }}</label></span
       >
-      <div class="selected-option" v-html="state.val2"></div>
+      <div v-html="state.val2"></div>
     </nut-cell>
     <nut-cell :isLink="true" @click="switchActionSheet('isVisible3')">
       <span
         ><label>{{ translate('showDescription') }}</label></span
       >
-      <div class="selected-option" v-html="state.val3"></div>
+      <div v-html="state.val3"></div>
     </nut-cell>
     <h2>{{ translate('optionStatus') }}</h2>
 
@@ -25,7 +25,7 @@
       <span
         ><label>{{ translate('optionStatus') }}</label></span
       >
-      <div class="selected-option" v-html="state.val4"></div>
+      <div v-html="state.val4"></div>
     </nut-cell>
 
     <h2>{{ translate('customContent') }}</h2>
@@ -34,7 +34,7 @@
       <span
         ><label>{{ translate('customContent') }}</label></span
       >
-      <div class="selected-option"></div>
+      <div></div>
     </nut-cell>
 
     <!-- demo 基础用法 -->

+ 7 - 7
src/packages/__VUE/actionsheet/doc.taro.md

@@ -23,7 +23,7 @@ app.use(ActionSheet);
   <nut-cell
       :show-icon="true"
       :isLink="true"
-      @click="switchActionSheet('isVisible')"
+      @click="switchActionSheet('isVisible1')"
      
     >
       <span><label>基础用法</label></span>
@@ -31,8 +31,8 @@ app.use(ActionSheet);
     </nut-cell>
      <!-- demo 基础用法 -->
     <nut-action-sheet
-      v-model:visible="state.isVisible"
-      :menu-items="menuItems"
+      v-model:visible="state.isVisible1"
+      :menu-items="menuItemsOne"
       @choose="chooseItem"
     >
     </nut-action-sheet>
@@ -43,10 +43,10 @@ import { reactive } from 'vue';
 export default {
   setup() {
   const state = reactive({
-      isVisible: false,
+      isVisible1: false,
       val: '',
     });
-     const menuItems = [
+     const menuItemsOne = [
       {
         name: '选项一'
       },
@@ -58,7 +58,7 @@ export default {
       }
     ];
     const switchActionSheet = ( param ) => {
-      state.isVisible = !state.isVisible;
+      state.isVisible1 = !state.isVisible1;
     };
       const chooseItem = (itemParams) => {
       state.val = itemParams.name;
@@ -66,7 +66,7 @@ export default {
     return {
       state,
       switchActionSheet,
-      menuItems,
+      menuItemsOne,
       chooseItem,
     };
   }

+ 7 - 9
src/packages/__VUE/divider/doc.en-US.md

@@ -92,15 +92,13 @@ User can custom divider style with style attribute.
 
 ``` html
 <template>
-  <nut-cell>
-    <div :style="{fontSize: '14px'}">
-      Text
-      <nut-divider direction="vertical" />
-      <a href="#" :style="{ color: '#1989fa' }">Link</a>
-      <nut-divider direction="vertical" />
-      <a href="#" :style="{ color: '#1989fa' }">Link</a>
-    </div>
-  </nut-cell>
+  <div :style="{ fontSize: '14px', marginLeft: '27px', color: '#909ca4' }">
+    Text
+    <nut-divider direction="vertical" />
+    <a href="#" :style="{ color: '#1989fa' }">Link</a>
+    <nut-divider direction="vertical" />
+    <a href="#" :style="{ color: '#1989fa' }">Link</a>
+  </div>
 </template>
 ```
 

+ 7 - 9
src/packages/__VUE/divider/doc.md

@@ -92,15 +92,13 @@ app.use(Divider);
 
 ``` html
 <template>
-  <nut-cell>
-    <div :style="{fontSize: '14px'}">
-      文本
-      <nut-divider direction="vertical" />
-      <a href="#" :style="{ color: '#1989fa' }">链接</a>
-      <nut-divider direction="vertical" />
-      <a href="#" :style="{ color: '#1989fa' }">链接</a>
-    </div>
-  </nut-cell>
+  <div :style="{ fontSize: '14px', marginLeft: '27px', color: '#909ca4' }">
+    文本
+    <nut-divider direction="vertical" />
+    <a href="#" :style="{ color: '#1989fa' }">链接</a>
+    <nut-divider direction="vertical" />
+    <a href="#" :style="{ color: '#1989fa' }">链接</a>
+  </div>
 </template>
 ```
 

+ 7 - 9
src/packages/__VUE/divider/doc.taro.md

@@ -92,15 +92,13 @@ app.use(Divider);
 
 ``` html
 <template>
-  <nut-cell>
-    <div :style="{fontSize: '14px'}">
-      文本
-      <nut-divider direction="vertical" />
-      <a href="#" :style="{ color: '#1989fa' }">链接</a>
-      <nut-divider direction="vertical" />
-      <a href="#" :style="{ color: '#1989fa' }">链接</a>
-    </div>
-  </nut-cell>
+  <div :style="{ fontSize: '14px', marginLeft: '27px', color: '#909ca4' }">
+    文本
+    <nut-divider direction="vertical" />
+    <a href="#" :style="{ color: '#1989fa' }">链接</a>
+    <nut-divider direction="vertical" />
+    <a href="#" :style="{ color: '#1989fa' }">链接</a>
+  </div>
 </template>
 ```
 

+ 1 - 1
src/packages/__VUE/timedetail/demo.vue

@@ -3,7 +3,7 @@
     <h2>基本用法</h2>
     <nut-cell @click="handleClick1">
       <span><label>时间配送</label></span>
-      <div class="selected-option"> {{ val1 }} </div>
+      <div> {{ val1 }} </div>
     </nut-cell>
     <div class="timeselect-wrapper">
       <nut-time-select :visible="visible1"></nut-time-select>

+ 1 - 1
src/packages/__VUE/timepannel/demo.vue

@@ -3,7 +3,7 @@
     <h2>基本用法</h2>
     <nut-cell @click="handleClick1">
       <span><label>时间配送</label></span>
-      <div class="selected-option"> {{ val1 }} </div>
+      <div> {{ val1 }} </div>
     </nut-cell>
     <div class="timeselect-wrapper">
       <nut-time-select :visible="visible1"></nut-time-select>

+ 1 - 1
src/sites/mobile-taro/vue/src/app.config.ts

@@ -110,7 +110,7 @@ const subPackages = [
 ];
 
 export default {
-  pages: ['pages/index/index', 'pages/index/layout'],
+  pages: ['pages/index/index'],
   subPackages,
   window: {
     backgroundTextStyle: 'light',

+ 5 - 5
src/sites/mobile-taro/vue/src/feedback/pages/actionsheet/index.vue

@@ -3,28 +3,28 @@
     <h2>基本用法</h2>
     <nut-cell :show-icon="true" :isLink="true" @click="switchActionSheet('isVisible1')">
       <span><label>基础用法</label></span>
-      <div class="selected-option" v-html="state.val1"></div>
+      <div v-html="state.val1"></div>
     </nut-cell>
     <nut-cell :showIcon="true" :isLink="true" @click="switchActionSheet('isVisible2')">
       <span><label>展示取消按钮</label></span>
-      <div class="selected-option" v-html="state.val2"></div>
+      <div v-html="state.val2"></div>
     </nut-cell>
     <nut-cell :isLink="true" @click="switchActionSheet('isVisible3')">
       <span><label>展示描述信息</label></span>
-      <div class="selected-option" v-html="state.val3"></div>
+      <div v-html="state.val3"></div>
     </nut-cell>
     <h2>选项状态</h2>
 
     <nut-cell :isLink="true" @click="switchActionSheet('isVisible4')">
       <span><label>选项状态</label></span>
-      <div class="selected-option" v-html="state.val4"></div>
+      <div v-html="state.val4"></div>
     </nut-cell>
 
     <h2>自定义</h2>
 
     <nut-cell :isLink="true" @click="switchActionSheet('isVisible5')">
       <span><label>自定义内容</label></span>
-      <div class="selected-option"></div>
+      <div></div>
     </nut-cell>
 
     <!-- demo 基础用法 -->

+ 1 - 2
src/sites/mobile-taro/vue/src/pages/index/index.vue

@@ -65,8 +65,7 @@ export default {
 
     const navigateTo = (name, enName) => {
       Taro.navigateTo({
-        // url: `/${enName}/pages/${name}/index`
-        url: `/pages/index/layout?e=${enName}&n=${name}`
+        url: `/${enName}/pages/${name.toLowerCase()}/index`
       });
     };
 

+ 0 - 53
src/sites/mobile-taro/vue/src/pages/index/layout.vue

@@ -1,53 +0,0 @@
-<template>
-  <div class="index">
-    <Header :compName="compName" />
-    <iframe :src="src"></iframe>
-  </div>
-</template>
-
-<script lang="ts">
-import { getCurrentInstance } from '@tarojs/taro';
-import { ref, computed, Ref } from 'vue';
-import Header from '../../components/header.vue';
-export default {
-  name: 'NutUI',
-  components: {
-    Header
-  },
-  setup() {
-    let compName = ref('') as Ref;
-
-    let $instance = getCurrentInstance();
-
-    compName.value = $instance.router?.params.n;
-
-    const src = computed(() => {
-      return `/#/${$instance.router?.params.e}/pages/${$instance.router?.params.n}/index`;
-    });
-
-    return {
-      compName,
-      src
-    };
-  }
-};
-</script>
-<style lang="scss">
-.index {
-  position: fixed;
-  top: 0;
-  bottom: 0;
-  left: 0;
-  right: 0;
-  overflow-y: auto;
-}
-iframe {
-  border: 0;
-  position: fixed;
-  top: 57px;
-  bottom: 0;
-  left: 0;
-  width: 100%;
-  height: calc(100% - 57px);
-}
-</style>