From a6c5c4c9332ea28132fb20e5490e1dd2d5319fde Mon Sep 17 00:00:00 2001
From: anne-lxm <1076217653@qq.com>
Date: Mon, 20 Dec 2021 15:38:25 +0800
Subject: [PATCH] adjust vue nvue

---
 docs/nvue-api.md        | 11 ++++---
 docs/nvue-css.md        |  6 ++--
 docs/nvue-outline.md    | 32 +++++++++----------
 docs/vue-api.md         |  4 +--
 docs/vue-basics.md      |  6 ++--
 docs/vue-components.md  | 16 +++++-----
 docs/vue-vuex.md        | 70 ++++++++++++++++++++---------------------
 docs/vue3-api.md        |  4 +--
 docs/vue3-basics.md     |  6 ++--
 docs/vue3-components.md | 20 ++++++------
 docs/vue3-vuex.md       | 70 ++++++++++++++++++++---------------------
 11 files changed, 123 insertions(+), 122 deletions(-)

diff --git a/docs/nvue-api.md b/docs/nvue-api.md
index a3161c573..86494c86d 100644
--- a/docs/nvue-api.md
+++ b/docs/nvue-api.md
@@ -563,7 +563,7 @@ BindingX类似一种强化版的css，运行性能高，但没有js那样足够
 
 ##### 代码示例:
 ```html
-	//test.nvue
+	<!-- test.nvue -->
 	<template>
 	    <view @click="test">
 	        <text>点击页面发送数据</text>
@@ -581,7 +581,7 @@ BindingX类似一种强化版的css，运行性能高，但没有js那样足够
 ```
 
 ```html
-	//App.vue
+	<!-- App.vue -->
 	<script>
 	    export default {
 	        onUniNViewMessage:function(e){
@@ -613,8 +613,8 @@ BindingX类似一种强化版的css，运行性能高，但没有js那样足够
 
 ##### 代码示例:
 
-```javascript
-	//index.nvue
+```html
+	<!-- index.nvue -->
 	<template>
 	    <div @click="test">
 	        <text>点击页面发送数据{{num}}</text>
@@ -644,10 +644,11 @@ BindingX类似一种强化版的css，运行性能高，但没有js那样足够
 	            }
 	        }
 	    }
+	</script>
 ```
 
 ```html
-	//test.vue
+	<!-- test.vue -->
 	<template>
 	    <view>
 	        <button type="primary" @click="test">点击改变nvue的数据</button>
diff --git a/docs/nvue-css.md b/docs/nvue-css.md
index 6aa08b5d8..010c8bf54 100644
--- a/docs/nvue-css.md
+++ b/docs/nvue-css.md
@@ -250,7 +250,7 @@ flex {number}：值为 number 类型。
 
 
 ``` html
-	//Gird布局
+	<!-- Gird布局 -->
 	<template>
 		<view>
 			<view v-for="(v, i) in list" class="row">
@@ -295,7 +295,7 @@ flex {number}：值为 number 类型。
 
 
 ``` html
-	//等高模块
+	<!-- 等高模块 -->
 	<template>
 	  <view>
 	    <view style="width:300px; height:100px;">
@@ -325,7 +325,7 @@ flex {number}：值为 number 类型。
 
 
 ``` html
-	//水平垂直居中
+	<!-- 水平垂直居中 -->
 	<template>
 		<view class="wrapper">
 			<view class="box"></view>
diff --git a/docs/nvue-outline.md b/docs/nvue-outline.md
index fc0bd9f0e..6c93e2bf2 100644
--- a/docs/nvue-outline.md
+++ b/docs/nvue-outline.md
@@ -56,11 +56,11 @@ uni-app在App端，支持vue页面和nvue页面混搭、互相跳转。也支持
 ```javascript
 	// manifest.json    
 	{    
-	     // ...    
-		/* App平台特有配置 */    
-	    "app-plus": {    
-	        "renderer": "native", //App端纯原生渲染模式
-	    }    
+	   // ...    
+		// App平台特有配置  
+	   "app-plus": {    
+	      "renderer": "native", //App端纯原生渲染模式
+	   }    
 	}
 ```
 
@@ -95,14 +95,14 @@ weex的组件和JS API，与uni-app不同。uni-app与微信小程序相同。
 - uni-app
 
 ```javascript
-// manifest.json    
-{    
-	// ...    
-	/* App平台特有配置 */    
-	"app-plus": {    
-	    "nvueCompiler":"uni-app" //是否启用 uni-app 模式  
-	}    
-}
+	// manifest.json    
+	{    
+		// ...    
+		// App平台特有配置    
+		"app-plus": {    
+			"nvueCompiler":"uni-app" //是否启用 uni-app 模式  
+		}    
+	}
 ```
 
 
@@ -144,7 +144,7 @@ weex 编译模式下支持使用 weex ui ，例子[详见](https://ext.dcloud.ne
   // manifest.json  
   {        
       // ...        
-       /* App平台特有配置 */        
+      // App平台特有配置       
       "app-plus":  {  
           "nvueStyleCompiler": "uni-app"  
       }  
@@ -259,10 +259,10 @@ iOS平台默认情况下滚动容器组件（如```list```、```waterfall```组
 ```html
 	<list class="scroll-v list" enableBackToTop="true" scroll-y alwaysScrollableVertical="true">
 		<refresh class="refresh" @refresh="onrefresh()" @pullingdown="onpullingdown">
-			//refresh content
+			<!-- refresh content -->
 		</refresh>
 		<cell v-for="(newsitem,index) in list" :key="newsitem.id">
-			//cell content
+			<!-- cell content -->
 		</cell>
 	</list>
 ```
diff --git a/docs/vue-api.md b/docs/vue-api.md
index de4ff3dfb..a2319b9e8 100644
--- a/docs/vue-api.md
+++ b/docs/vue-api.md
@@ -274,7 +274,7 @@ uni-app 内置了 [Vuex](https://uniapp.dcloud.io/vue-vuex) ，在app里的使
 
 解决办法有两种（以scroll-view组件为例）：
 
-1.监听scroll事件，记录组件内部变化的值，在设置新值之前先设置为记录的当前值
+1. 监听scroll事件，记录组件内部变化的值，在设置新值之前先设置为记录的当前值
 
 
 
@@ -308,7 +308,7 @@ export default {
 
 ```
 
-2.监听scroll事件，获取组件内部变化的值，实时更新其绑定值
+2. 监听scroll事件，获取组件内部变化的值，实时更新其绑定值
 
 ```html
 	<scroll-view scroll-y="true" :scroll-top="scrollTop" @scroll="scroll"></scroll-view>
diff --git a/docs/vue-basics.md b/docs/vue-basics.md
index b5d5938e2..d19e476a0 100644
--- a/docs/vue-basics.md
+++ b/docs/vue-basics.md
@@ -125,9 +125,9 @@ vue 是单页面应用，使页面局部刷新，不用每次跳转页面都要
 当然还有一些高级的用法
 
 ```js
-	<!-- 直接使用js模块的属性。在hello uni-app有示例   -->
+	// 直接使用js模块的属性。在hello uni-app有示例 
 	var dateUtils = require('../../../common/util.js').dateUtils; 
-	<!-- 将js导入并重命名为echarts，然后使用echarts.来继续执行方法。在hello uni-app有示例 -->
+	// 将js导入并重命名为echarts，然后使用echarts.来继续执行方法。在hello uni-app有示例 
 	import * as echarts from '/components/echarts/echarts.simple.min.js'; 
 ```
 
@@ -1502,7 +1502,7 @@ Vue 提供了一种更通用的方式来观察和响应 Vue 实例上的数据
 			}
 		},
 		watch: {
-			/* 使用watch来响应数据的变化 */
+			// 使用watch来响应数据的变化
 			word(newVal, oldVal) {
 				console.log('最新值是：'+newVal,"原来的值是："+ oldVal);
 			}
diff --git a/docs/vue-components.md b/docs/vue-components.md
index f89073d42..f131c865b 100644
--- a/docs/vue-components.md
+++ b/docs/vue-components.md
@@ -92,7 +92,7 @@
 - Vue.component 的第一个参数必须是静态的字符串。
 - nvue 页面暂不支持全局组件。
 
-1.`main.js` 里进行全局导入和注册
+1. `main.js` 里进行全局导入和注册
 
 ```js
 	import Vue from 'vue'
@@ -100,7 +100,7 @@
 	Vue.component('page-head',pageHead)
 ```
 
-2.`index.vue` 里可直接使用组件
+2. `index.vue` 里可直接使用组件
  
 
 ```html
@@ -122,7 +122,7 @@
 
 如下通过两种方式导入一个角标的组件库，[详见](https://ext.dcloud.net.cn/plugin?id=21)，推荐使用 `easycom` 方式引入。
 
-1.**传统vue规范：** 在 index.vue 页面中，通过 `import` 方式引入组件 ，在 `components` 选项中定义你想要使用的组件。
+1. **传统vue规范：** 在 index.vue 页面中，通过 `import` 方式引入组件 ，在 `components` 选项中定义你想要使用的组件。
 
 ```html
 	<!-- 在index.vue引入 uni-badge 组件-->
@@ -147,7 +147,7 @@
 - 包含了这个组件选项的变量名(仅支持驼峰法命名)
 
 
-2.**通过uni-app的[easycom](https://uniapp.dcloud.io/collocation/pages?id=easycom)：** 将组件引入精简为一步。只要组件安装在项目的 `components` 目录下，并符合 `components/组件名称/组件名称.vue` 目录结构。就可以不用引用、注册，直接在页面中使用。
+2. **通过uni-app的[easycom](https://uniapp.dcloud.io/collocation/pages?id=easycom)：** 将组件引入精简为一步。只要组件安装在项目的 `components` 目录下，并符合 `components/组件名称/组件名称.vue` 目录结构。就可以不用引用、注册，直接在页面中使用。
 
 
 ```html
@@ -375,10 +375,10 @@
 
 ```html
 
-//非H5端不支持通过this.$refs.content来获取view实例
+<!-- 非H5端不支持通过this.$refs.content来获取view实例 -->
 <view ref="content">hello</view>
 
-//支持通过this.$refs.child来获取child-component实例
+<!-- 支持通过this.$refs.child来获取child-component实例 -->
 <child-component ref="child"></child-component>
 
 ```
@@ -410,7 +410,7 @@
 ##### 示例：
 
 ```html
-//base-input子组件页面
+<!-- base-input子组件页面 -->
 <template>
 	<view>
 		<input :focus="isFocus" type="text" placeholder="请输入内容" />
@@ -438,7 +438,7 @@
 
 
 ```html
-//index 父组件页面
+<!-- index 父组件页面 -->
 <template>
 	<view>
 		<base-input ref="usernameInput"></base-input>
diff --git a/docs/vue-vuex.md b/docs/vue-vuex.md
index 9bd3fc3e8..d57e55fbd 100644
--- a/docs/vue-vuex.md
+++ b/docs/vue-vuex.md
@@ -185,10 +185,10 @@ const Counter = {
 Vuex 通过 store 选项，提供了一种机制将状态从根组件“注入”到每一个子组件中（需调用 Vue.use(Vuex)）：
 
 
-1.在 `uni-app` 项目根目录下，新建 `store` 目录，在此目录下新建 `index.js` 文件。在 `index.js` 文件配置如下：
+1. 在 `uni-app` 项目根目录下，新建 `store` 目录，在此目录下新建 `index.js` 文件。在 `index.js` 文件配置如下：
 
 ```js
-<!-- 页面路径：store/index.js -->
+// 页面路径：store/index.js 
 import Vue from 'vue'
 import Vuex from 'vuex'
 
@@ -205,10 +205,10 @@ export default store
 ```
 
 
-2.在 `main.js` 中导入文件。
+2. 在 `main.js` 中导入文件。
 
 ```js
-<!-- 页面路径：main.js -->
+// 页面路径：main.js
 import Vue from 'vue'
 import App from './App'
 import store from './store'
@@ -227,7 +227,7 @@ app.$mount()
 **获取state**
 
 
-1.通过属性访问，需要在根节点注入 `store` 。
+1. 通过属性访问，需要在根节点注入 `store` 。
 
 ```html
 <!-- 页面路径：pages/index/index.vue -->
@@ -251,7 +251,7 @@ app.$mount()
 </script>
 ```
 
-2.在组件中使用，通过 `this.$store` 访问到 `state` 里的数据。
+2. 在组件中使用，通过 `this.$store` 访问到 `state` 里的数据。
 
 ```html
 <!-- 页面路径：pages/index/index.vue -->
@@ -277,7 +277,7 @@ app.$mount()
 
 #### mapState
 
-3.通过 `mapState` 辅助函数获取。
+3. 通过 `mapState` 辅助函数获取。
 
 当一个组件需要获取多个状态的时候，将这些状态都声明为计算属性会有些重复和冗余。
 为了解决这个问题，我们可以使用 **mapState 辅助函数** 帮助我们生成计算属性，让你少按几次键：
@@ -403,7 +403,7 @@ app.$mount()
 在 `uni-app` 项目根目录下，`store` 目录 `index.js` 文件下：
 
 ```js
-<!-- 页面路径：store/index.js -->
+// 页面路径：store/index.js
 import Vue from 'vue'
 import Vuex from 'vuex'
 
@@ -442,7 +442,7 @@ export default store
 - getters, 等同于 store.getters
 
 ```js
-<!-- 页面路径：store/index.js -->
+// 页面路径：store/index.js
 import Vue from 'vue'
 import Vuex from 'vuex'
 
@@ -484,7 +484,7 @@ export default store
 **获取getters**
 
 
-1.通过属性访问，`Getter` 会暴露为 `store.getters` 对象，你可以以属性的形式访问这些值。
+1. 通过属性访问，`Getter` 会暴露为 `store.getters` 对象，你可以以属性的形式访问这些值。
 
 
 ```html
@@ -514,7 +514,7 @@ export default store
 
 
 
-2.通过 `this.$store` 访问。
+2. 通过 `this.$store` 访问。
 
 ```html
 <!-- 页面路径：pages/index/index.vue -->
@@ -539,7 +539,7 @@ export default store
 ```
 
 
-3.通过方法访问。
+3. 通过方法访问。
 
 你也可以通过让 `getter` 返回一个函数，来实现给 `getter` 传参。在你对 `store` 里的数组进行查询时非常有用。
 
@@ -570,7 +570,7 @@ export default store
 #### mapGetters
 
 
-4.通过 `mapGetters` 辅助函数访问。
+4. 通过 `mapGetters` 辅助函数访问。
 
 `mapGetters` 辅助函数仅仅是将 `store` 中的 `getter` 映射到局部计算属性：
 
@@ -635,7 +635,7 @@ Vuex 中的 `mutation` 非常类似于事件：每个 `mutation` 都有一个字
 
 
 ```js
-<!-- 页面路径：store/index.js -->
+// 页面路径：store/index.js 
 import Vue from 'vue'
 import Vuex from 'vuex'
 
@@ -699,7 +699,7 @@ export default {
 - 在 `mutation` 传参（载荷）可以传递一个参数。
 
 ```js
-<!-- 页面路径：store/index.js -->
+// 页面路径：store/index.js
 import Vue from 'vue'
 import Vuex from 'vuex'
 
@@ -748,7 +748,7 @@ export default store
 
 
 ```js
-<!-- 页面路径：store/index.js -->
+// 页面路径：store/index.js
 import Vue from 'vue'
 import Vuex from 'vuex'
 
@@ -798,7 +798,7 @@ export default store
 **提交方式**
 
 
-1.对象风格的提交方式
+1. 对象风格的提交方式
 
 我们修改组件中 `store.commit` 提交方式：
 
@@ -844,7 +844,7 @@ export default store
 
 #### mapMutations
 
-2.通过 `mapMutations` 辅助函数提交。
+2. 通过 `mapMutations` 辅助函数提交。
 
 创建组件方法提交 `mutation`。
 
@@ -876,7 +876,7 @@ export default store
 
 
 ```js
-<!-- 页面路径：store/index.js -->
+// 页面路径：store/index.js 
 import Vue from 'vue'
 import Vuex from 'vuex'
 
@@ -950,7 +950,7 @@ export default store
 让我们来注册一个简单的 `action` ：
 
 ```js
-<!-- 页面路径：store/index.js -->
+// 页面路径：store/index.js
 import Vue from 'vue'
 import Vuex from 'vuex'
 
@@ -995,7 +995,7 @@ export default store
 
 **分发 Action**
 
-1.`actions` 通过 `store.dispatch` 方法触发。
+1. `actions` 通过 `store.dispatch` 方法触发。
 
 ```html
 <!-- 页面路径：pages/index/index.vue -->
@@ -1029,7 +1029,7 @@ export default store
 
 
 ```js
-<!-- 页面路径：store/index.js -->
+// 页面路径：store/index.js
 import Vue from 'vue'
 import Vuex from 'vuex'
 
@@ -1103,7 +1103,7 @@ export default store
 
 
 ```js
-<!-- 页面路径：store/index.js -->
+// 页面路径：store/index.js
 import Vue from 'vue'
 import Vuex from 'vuex'
 
@@ -1159,7 +1159,7 @@ export default store
 
 #### mapActions 
 
-2.通过 `mapActions` 辅助函数分发。
+2. 通过 `mapActions` 辅助函数分发。
 
 创建组件方法分发 `action`。
 
@@ -1292,7 +1292,7 @@ export default store
 
 为了解决以上问题，`Vuex` 允许我们将 `store` 分割成模块（module）。每个模块拥有自己的 `state`、`mutation`、`action`、`getter`、甚至是嵌套子模块——从上至下进行同样方式的分割：
 
-1.在 `store` 文件夹下新建 `modules` 文件夹，并在下面新建 `moduleA.js` 和 `moduleB.js` 文件用来存放 `vuex` 的 `modules` 模块。
+1. 在 `store` 文件夹下新建 `modules` 文件夹，并在下面新建 `moduleA.js` 和 `moduleB.js` 文件用来存放 `vuex` 的 `modules` 模块。
 
 
 ```html
@@ -1316,10 +1316,10 @@ export default store
 ```
 
 
-2.在 `main.js` 文件中引入 `store`。
+2. 在 `main.js` 文件中引入 `store`。
 
 ```js
-<!-- 页面路径：main.js -->
+	// 页面路径：main.js 
 	import Vue from 'vue'
 	import App from './App'
 	import store from './store'
@@ -1335,10 +1335,10 @@ export default store
 ```
 
 
-3.在项目根目录下，新建 `store` 文件夹，并在下面新建 `index.js` 文件，作为模块入口，引入各子模块。
+3. 在项目根目录下，新建 `store` 文件夹，并在下面新建 `index.js` 文件，作为模块入口，引入各子模块。
 
 ```js
-<!-- 页面路径：store/index.js -->
+	//  页面路径：store/index.js
 	import Vue from 'vue'
 	import Vuex from 'vuex'
 
@@ -1353,10 +1353,10 @@ export default store
 	})
 ```
 
-4.子模块 `moduleA` 页面内容。
+4. 子模块 `moduleA` 页面内容。
 
 ```js
-<!-- 子模块moduleA路径：store/modules/moduleA.js -->
+// 子模块moduleA路径：store/modules/moduleA.js 
 export default {
 	state: {
 		text:"我是moduleA模块下state.text的值"
@@ -1373,10 +1373,10 @@ export default {
 }
 ```
 
-5.子模块 `moduleB` 页面内容。
+5. 子模块 `moduleB` 页面内容。
 
 ```js
-<!-- 子模块moduleB路径：store/modules/moduleB.js -->
+// 子模块moduleB路径：store/modules/moduleB.js
 export default {
 	state: {
 		timestamp: 1608820295//初始时间戳
@@ -1407,7 +1407,7 @@ export default {
 ```
 
 
-6.在页面中引用组件 myButton ，并通过 `mapState` 读取 `state` 中的初始数据。
+6. 在页面中引用组件 myButton ，并通过 `mapState` 读取 `state` 中的初始数据。
 
 
 ```html
@@ -1436,7 +1436,7 @@ export default {
 </script>
 ```
 
-7.在组件 `myButton`中，通过 `mutations` 操作刷新当前时间。
+7. 在组件 `myButton`中，通过 `mutations` 操作刷新当前时间。
 
 ```html
 <!-- 组件路径：components/myButton/myButton.vue -->
diff --git a/docs/vue3-api.md b/docs/vue3-api.md
index 774e088f0..00f001607 100644
--- a/docs/vue3-api.md
+++ b/docs/vue3-api.md
@@ -364,7 +364,7 @@ export default {
 
 解决办法有两种（以`scroll-view`组件为例）：
 
-1.监听`scroll`事件，记录组件内部变化的值，在设置新值之前先设置为记录的当前值
+1. 监听`scroll`事件，记录组件内部变化的值，在设置新值之前先设置为记录的当前值
 
 
 
@@ -398,7 +398,7 @@ export default {
 
 ```
 
-2.监听scroll事件，获取组件内部变化的值，实时更新其绑定值
+2. 监听scroll事件，获取组件内部变化的值，实时更新其绑定值
 
 ```html
 	<scroll-view scroll-y="true" :scroll-top="scrollTop" @scroll="scroll"></scroll-view>
diff --git a/docs/vue3-basics.md b/docs/vue3-basics.md
index 0da346695..2dcf60bb8 100644
--- a/docs/vue3-basics.md
+++ b/docs/vue3-basics.md
@@ -135,9 +135,9 @@ vue 是单页面应用，使页面局部刷新，不用每次跳转页面都要
 当然还有一些高级的用法
 
 ```js
-	<!-- 直接使用js模块的属性。在hello uni-app有示例   -->
+	// 直接使用js模块的属性。在hello uni-app有示例 
 	var dateUtils = require('../../../common/util.js').dateUtils; 
-	<!-- 将js导入并重命名为echarts，然后使用echarts.来继续执行方法。在hello uni-app有示例 -->
+	// 将js导入并重命名为echarts，然后使用echarts.来继续执行方法。在hello uni-app有示例
 	import * as echarts from '/components/echarts/echarts.simple.min.js'; 
 ```
 
@@ -1707,7 +1707,7 @@ v-for 指令可以实现基于一个数组来渲染一个列表。
 				}
 			},
 			watch: {
-				/* 使用watch来响应数据的变化，第一个参数为newVal新值，第二个参数oldVal为旧值*/
+				//使用watch来响应数据的变化，第一个参数为newVal新值，第二个参数oldVal为旧值
 				a: function(newVal, oldVal) {
 					console.log("a--newVal: ", newVal, "a--oldVal: ",oldVal);
 				},
diff --git a/docs/vue3-components.md b/docs/vue3-components.md
index 6837eab5b..16a4c5115 100644
--- a/docs/vue3-components.md
+++ b/docs/vue3-components.md
@@ -95,7 +95,7 @@
 - app.component 的第一个参数必须是静态的字符串。
 - nvue 页面暂不支持全局组件。
 
-1.`main.js` 里进行全局导入和注册
+1. `main.js` 里进行全局导入和注册
 
 ```js
 	import App from './App'
@@ -112,7 +112,7 @@
 	}
 ```
 
-2.`index.vue` 里可直接使用组件
+2. `index.vue` 里可直接使用组件
  
 
 ```html
@@ -134,7 +134,7 @@
 
 如下通过两种方式导入一个角标的组件库，[详见](https://ext.dcloud.net.cn/plugin?id=21)，推荐使用 `easycom` 方式引入。
 
-1.**传统vue规范：** 在 index.vue 页面中，通过 `import` 方式引入组件 ，在 `components` 选项中定义你想要使用的组件。
+1. **传统vue规范：** 在 index.vue 页面中，通过 `import` 方式引入组件 ，在 `components` 选项中定义你想要使用的组件。
 
 ```html
 	<!-- 在index.vue引入 uni-badge 组件-->
@@ -159,7 +159,7 @@
 - 包含了这个组件选项的变量名(仅支持驼峰法命名)
 
 
-2.**通过uni-app的[easycom](https://uniapp.dcloud.io/collocation/pages?id=easycom)：** 将组件引入精简为一步。只要组件安装在项目的 `components` 目录下，并符合 `components/组件名称/组件名称.vue` 目录结构。就可以不用引用、注册，直接在页面中使用。
+2. **通过uni-app的[easycom](https://uniapp.dcloud.io/collocation/pages?id=easycom)：** 将组件引入精简为一步。只要组件安装在项目的 `components` 目录下，并符合 `components/组件名称/组件名称.vue` 目录结构。就可以不用引用、注册，直接在页面中使用。
 
 
 ```html
@@ -401,7 +401,7 @@
 
 
 
-2.**这个 `prop` 以一种原始的值传入且需要进行转换**。在这种情况下，最好使用这个 `prop` 的值来定义一个计算属性：
+2. **这个 `prop` 以一种原始的值传入且需要进行转换**。在这种情况下，最好使用这个 `prop` 的值来定义一个计算属性：
 
 
 ```html
@@ -607,7 +607,7 @@
 
 
 ```js
-	<!-- 我是子组件date-picker -->
+	// 我是子组件date-picker
 	export default {
 		created() {
 		  console.log(this.$attrs) // { onChange: () => {}  }
@@ -679,7 +679,7 @@
 
 有了这个新配置，`data status` attribute 将应用于 `input` 元素！
 
-```js
+```html
 	<!-- Date-picker 组件 使用非 prop attribute -->
 	<date-picker data-status="activated"></date-picker>
 
@@ -700,15 +700,15 @@
 ```
 
 ```html
-	// 我是custom-layout组件
-	// 这将发出警告
+	<!-- 我是custom-layout组件 -->
+	<!-- 这将发出警告 -->
 	<template>
 		<header>...</header>
 		<main>...</main>
 		<footer>...</footer>
 	</template>
 
-	// 没有警告，$attrs被传递到<main>元素
+	<!-- 没有警告，$attrs被传递到<main>元素 -->
 
 	<template>
 		<header>...</header>
diff --git a/docs/vue3-vuex.md b/docs/vue3-vuex.md
index 6ef563d1c..4862a69cc 100644
--- a/docs/vue3-vuex.md
+++ b/docs/vue3-vuex.md
@@ -191,10 +191,10 @@ const Counter = {
 Vuex 通过 store 选项，提供了一种机制将状态从根组件“注入”到每一个子组件中（需调用 Vue.use(Vuex)）：
 
 
-1.在 `uni-app` 项目根目录下，新建 `store` 目录，在此目录下新建 `index.js` 文件。在 `index.js` 文件配置如下：
+1. 在 `uni-app` 项目根目录下，新建 `store` 目录，在此目录下新建 `index.js` 文件。在 `index.js` 文件配置如下：
 
 ```js
-<!-- 页面路径：store/index.js -->
+// 页面路径：store/index.js
 import { createStore } from 'vuex'
 const store = createStore({
 	state:{//存放状态
@@ -207,10 +207,10 @@ export default store
 ```
 
 
-2.在 `main.js` 中导入文件。
+2. 在 `main.js` 中导入文件。
 
 ```js
-<!-- 页面路径：main.js -->
+// 页面路径：main.js 
 import App from './App'
 import store from './store'
 import {createSSRApp} from 'vue'
@@ -226,7 +226,7 @@ export function createApp() {
 **获取state**
 
 
-1.通过属性访问，需要在根节点注入 `store` 。
+1. 通过属性访问，需要在根节点注入 `store` 。
 
 ```html
 <!-- 页面路径：pages/index/index.vue -->
@@ -250,7 +250,7 @@ export function createApp() {
 </script>
 ```
 
-2.在组件中使用，通过 `this.$store` 访问到 `state` 里的数据。
+2. 在组件中使用，通过 `this.$store` 访问到 `state` 里的数据。
 
 ```html
 <!-- 页面路径：pages/index/index.vue -->
@@ -276,7 +276,7 @@ export function createApp() {
 
 #### mapState
 
-3.通过 `mapState` 辅助函数获取。
+3. 通过 `mapState` 辅助函数获取。
 
 当一个组件需要获取多个状态的时候，将这些状态都声明为计算属性会有些重复和冗余。
 为了解决这个问题，我们可以使用 **mapState 辅助函数** 帮助我们生成计算属性，让你少按几次键：
@@ -404,7 +404,7 @@ export function createApp() {
 在 `uni-app` 项目根目录下，`store` 目录 `index.js` 文件下：
 
 ```js
-<!-- 页面路径：store/index.js -->
+// 页面路径：store/index.js
 import { createStore } from 'vuex'
 const store = createStore({
 	state: {
@@ -437,7 +437,7 @@ export default store
 - getters, 等同于 store.getters
 
 ```js
-<!-- 页面路径：store/index.js -->
+// 页面路径：store/index.js 
 
 import { createStore } from 'vuex'
 const store = createStore({
@@ -475,7 +475,7 @@ export default store
 **获取getters**
 
 
-1.通过属性访问，`Getter` 会暴露为 `store.getters` 对象，你可以以属性的形式访问这些值。
+1. 通过属性访问，`Getter` 会暴露为 `store.getters` 对象，你可以以属性的形式访问这些值。
 
 
 ```html
@@ -505,7 +505,7 @@ export default store
 
 
 
-2.通过 `this.$store` 访问。
+2. 通过 `this.$store` 访问。
 
 ```html
 <!-- 页面路径：pages/index/index.vue -->
@@ -530,7 +530,7 @@ export default store
 ```
 
 
-3.通过方法访问。
+3. 通过方法访问。
 
 你也可以通过让 `getter` 返回一个函数，来实现给 `getter` 传参。在你对 `store` 里的数组进行查询时非常有用。
 
@@ -561,7 +561,7 @@ export default store
 #### mapGetters
 
 
-4.通过 `mapGetters` 辅助函数访问。
+4. 通过 `mapGetters` 辅助函数访问。
 
 `mapGetters` 辅助函数仅仅是将 `store` 中的 `getter` 映射到局部计算属性：
 
@@ -626,7 +626,7 @@ Vuex 中的 `mutation` 非常类似于事件：每个 `mutation` 都有一个字
 
 
 ```js
-<!-- 页面路径：store/index.js -->
+// 页面路径：store/index.js
 import { createStore } from 'vuex'
 const store = createStore({
 	state: {
@@ -685,7 +685,7 @@ export default {
 - 在 `mutation` 传参（载荷）可以传递一个参数。
 
 ```js
-<!-- 页面路径：store/index.js -->
+// 页面路径：store/index.js 
 import { createStore } from 'vuex'
 const store = createStore({
 	state: {
@@ -730,7 +730,7 @@ export default store
 
 
 ```js
-<!-- 页面路径：store/index.js -->
+// 页面路径：store/index.js 
 import { createStore } from 'vuex'
 const store = createStore({
 	state: {
@@ -775,7 +775,7 @@ export default store
 **提交方式**
 
 
-1.对象风格的提交方式
+1. 对象风格的提交方式
 
 我们修改组件中 `store.commit` 提交方式：
 
@@ -821,7 +821,7 @@ export default store
 
 #### mapMutations
 
-2.通过 `mapMutations` 辅助函数提交。
+2. 通过 `mapMutations` 辅助函数提交。
 
 创建组件方法提交 `mutation`。
 
@@ -853,7 +853,7 @@ export default store
 
 
 ```js
-<!-- 页面路径：store/index.js -->
+// 页面路径：store/index.js
 import { createStore } from 'vuex'
 const store = createStore({
 	state: {
@@ -923,7 +923,7 @@ export default store
 让我们来注册一个简单的 `action` ：
 
 ```js
-<!-- 页面路径：store/index.js -->
+// 页面路径：store/index.js
 import { createStore } from 'vuex'
 const store = createStore({
 	state: {
@@ -964,7 +964,7 @@ export default store
 
 **分发 Action**
 
-1.`actions` 通过 `store.dispatch` 方法触发。
+1. `actions` 通过 `store.dispatch` 方法触发。
 
 ```html
 <!-- 页面路径：pages/index/index.vue -->
@@ -998,7 +998,7 @@ export default store
 
 
 ```js
-<!-- 页面路径：store/index.js -->
+// 页面路径：store/index.js 
 import { createStore } from 'vuex'
 const store = createStore({
 	state: {
@@ -1068,7 +1068,7 @@ export default store
 
 
 ```js
-<!-- 页面路径：store/index.js -->
+// 页面路径：store/index.js
 import { createStore } from 'vuex'
 const store = createStore({
 	state: {
@@ -1120,7 +1120,7 @@ export default store
 
 #### mapActions 
 
-2.通过 `mapActions` 辅助函数分发。
+2. 通过 `mapActions` 辅助函数分发。
 
 创建组件方法分发 `action`。
 
@@ -1253,7 +1253,7 @@ export default store
 
 为了解决以上问题，`Vuex` 允许我们将 `store` 分割成模块（module）。每个模块拥有自己的 `state`、`mutation`、`action`、`getter`、甚至是嵌套子模块——从上至下进行同样方式的分割：
 
-1.在 `store` 文件夹下新建 `modules` 文件夹，并在下面新建 `moduleA.js` 和 `moduleB.js` 文件用来存放 `vuex` 的 `modules` 模块。
+1. 在 `store` 文件夹下新建 `modules` 文件夹，并在下面新建 `moduleA.js` 和 `moduleB.js` 文件用来存放 `vuex` 的 `modules` 模块。
 
 
 ```html
@@ -1277,10 +1277,10 @@ export default store
 ```
 
 
-2.在 `main.js` 文件中引入 `store`。
+2. 在 `main.js` 文件中引入 `store`。
 
 ```js
-<!-- 页面路径：main.js -->
+	// 页面路径：main.js
 	import {createSSRApp} from 'vue'
 	import store from './store'
 	export function createApp() {
@@ -1293,10 +1293,10 @@ export default store
 ```
 
 
-3.在项目根目录下，新建 `store` 文件夹，并在下面新建 `index.js` 文件，作为模块入口，引入各子模块。
+3. 在项目根目录下，新建 `store` 文件夹，并在下面新建 `index.js` 文件，作为模块入口，引入各子模块。
 
 ```js
-<!-- 页面路径：store/index.js -->
+// 页面路径：store/index.js
 import {createStore} from 'vuex'
 import moduleA from '@/store/modules/moduleA'
 import moduleB from '@/store/modules/moduleB'
@@ -1308,10 +1308,10 @@ export default createStore({
 })
 ```
 
-4.子模块 `moduleA` 页面内容。
+4. 子模块 `moduleA` 页面内容。
 
 ```js
-<!-- 子模块moduleA路径：store/modules/moduleA.js -->
+// 子模块moduleA路径：store/modules/moduleA.js 
 export default {
 	state: {
 		text:"我是moduleA模块下state.text的值"
@@ -1328,10 +1328,10 @@ export default {
 }
 ```
 
-5.子模块 `moduleB` 页面内容。
+5. 子模块 `moduleB` 页面内容。
 
 ```js
-<!-- 子模块moduleB路径：store/modules/moduleB.js -->
+// 子模块moduleB路径：store/modules/moduleB.js
 export default {
 	state: {
 		timestamp: 1608820295//初始时间戳
@@ -1362,7 +1362,7 @@ export default {
 ```
 
 
-6.在页面中引用组件 myButton ，并通过 `mapState` 读取 `state` 中的初始数据。
+6. 在页面中引用组件 myButton ，并通过 `mapState` 读取 `state` 中的初始数据。
 
 
 ```html
@@ -1391,7 +1391,7 @@ export default {
 </script>
 ```
 
-7.在组件 `myButton`中，通过 `mutations` 操作刷新当前时间。
+7. 在组件 `myButton`中，通过 `mutations` 操作刷新当前时间。
 
 ```html
 <!-- 组件路径：components/myButton/myButton.vue -->
-- 
GitLab