diff --git a/pages/API/navigator/navigator.uvue b/pages/API/navigator/navigator.uvue
index 9debbebd7fc5b84a6b188a2eff1e165a078a8d10..67d7afbffdd97a440709f1e9c697dd6adeaf73f5 100644
--- a/pages/API/navigator/navigator.uvue
+++ b/pages/API/navigator/navigator.uvue
@@ -1,5 +1,5 @@
 <template>
-  <view>
+  <scroll-view>
     <page-head title="navigate"></page-head>
     <view class="uni-padding-wrap uni-common-mt uni-common-mb">
       <view class="direction-row">
@@ -42,7 +42,7 @@
         </button>
       </view>
     </view>
-  </view>
+  </scroll-view>
 </template>
 
 <script lang="uts">
@@ -341,7 +341,7 @@ export default {
     },
     customAnimation() {
       uni.navigateTo({
-        url: '/pages/API/navigator/new-page/new-page-1?data=自定义动画打开页面',
+        url: '/pages/API/navigator/new-page/new-page-2?data=自定义动画打开页面',
         animationType: 'slide-in-bottom',
         animationDuration: 200,
       })
diff --git a/pages/API/navigator/new-page/new-page-2.uvue b/pages/API/navigator/new-page/new-page-2.uvue
index 0ad97a53c537074c1a43276265c8991654b0fe5e..58299e00c63d435c2ed8c78cb8d5d6ca138f6736 100644
--- a/pages/API/navigator/new-page/new-page-2.uvue
+++ b/pages/API/navigator/new-page/new-page-2.uvue
@@ -1,8 +1,10 @@
 <template>
-  <view class="uni-padding-wrap container">
-    <page-head title="new-page-2" />
-    <button @click="scrollToBottom">scrollToBottom</button>
-  </view>
+  <scroll-view class="uni-padding-wrap">
+    <view class="container">
+      <page-head title="new-page-2" />
+      <button @click="scrollToBottom">scrollToBottom</button>
+    </view>
+  </scroll-view>
 </template>
 
 <script lang="uts">
@@ -10,72 +12,72 @@ import { State, state, setLifeCycleNum } from '@/store/index.uts'
 
 export default {
 	data() {
-    return {
+		return {
 			_state: state as State,
-      isScrolled: false,
-    }
-  },
-  onLoad(_: OnLoadOptions) {
-    // 自动化测试
-    setLifeCycleNum(state.lifeCycleNum + 100)
-  },
-  onShow() {
-    // 自动化测试
-    setLifeCycleNum(state.lifeCycleNum + 10)
-  },
-  onReady() {
-    // 自动化测试
-    setLifeCycleNum(state.lifeCycleNum + 10)
-  },
-  onPullDownRefresh() {
-    // 自动化测试
-    setLifeCycleNum(state.lifeCycleNum + 10)
-  },
-  onPageScroll(_) {
-    // 自动化测试
-    this.isScrolled = true
-  },
-  onReachBottom() {
-    // 自动化测试
-    setLifeCycleNum(state.lifeCycleNum + 10)
-  },
-  onBackPress(_: OnBackPressOptions): boolean | null {
-    // 自动化测试
-    setLifeCycleNum(state.lifeCycleNum - 10)
-    return null
-  },
-  onHide() {
-    // 自动化测试
-    setLifeCycleNum(state.lifeCycleNum - 10)
-  },
-  onUnload() {
-    // 自动化测试
-    setLifeCycleNum(state.lifeCycleNum - 100)
-  },
-  methods: {
-    // 自动化测试
-    getLifeCycleNum(): number {
-      return state.lifeCycleNum
-    },
-    // 自动化测试
-    setLifeCycleNum(num: number) {
-      setLifeCycleNum(num)
-    },
-    pullDownRefresh() {
-      uni.startPullDownRefresh({
-        success() {
-          setTimeout(() => {
-            uni.stopPullDownRefresh()
-          }, 1000)
-        },
-      })
-    },
-    scrollToBottom() {
-      uni.pageScrollTo({
-        scrollTop: 2000,
-      })
-    },
-  },
+			isScrolled: false,
+		}
+	},
+	onLoad(_ : OnLoadOptions) {
+		// 自动化测试
+		setLifeCycleNum(state.lifeCycleNum + 100)
+	},
+	onShow() {
+		// 自动化测试
+		setLifeCycleNum(state.lifeCycleNum + 10)
+	},
+	onReady() {
+		// 自动化测试
+		setLifeCycleNum(state.lifeCycleNum + 10)
+	},
+	onPullDownRefresh() {
+		// 自动化测试
+		setLifeCycleNum(state.lifeCycleNum + 10)
+	},
+	onPageScroll(_) {
+		// 自动化测试
+		this.isScrolled = true
+	},
+	onReachBottom() {
+		// 自动化测试
+		setLifeCycleNum(state.lifeCycleNum + 10)
+	},
+	onBackPress(_ : OnBackPressOptions) : boolean | null {
+		// 自动化测试
+		setLifeCycleNum(state.lifeCycleNum - 10)
+		return null
+	},
+	onHide() {
+		// 自动化测试
+		setLifeCycleNum(state.lifeCycleNum - 10)
+	},
+	onUnload() {
+		// 自动化测试
+		setLifeCycleNum(state.lifeCycleNum - 100)
+	},
+	methods: {
+		// 自动化测试
+		getLifeCycleNum() : number {
+			return state.lifeCycleNum
+		},
+		// 自动化测试
+		setLifeCycleNum(num : number) {
+			setLifeCycleNum(num)
+		},
+		pullDownRefresh() {
+			uni.startPullDownRefresh({
+				success() {
+					setTimeout(() => {
+						uni.stopPullDownRefresh()
+					}, 1000)
+				},
+			})
+		},
+		scrollToBottom() {
+			uni.pageScrollTo({
+				scrollTop: 2000,
+			})
+		},
+	},
 }
 </script>
 
diff --git a/pages/tabBar/API.uvue b/pages/tabBar/API.uvue
index 41ac393d01ec023a6477c5dfc1175d04ba6a0115..8a75187e5cf1383b0a6b0c261336a4f7cc3f5ac9 100644
--- a/pages/tabBar/API.uvue
+++ b/pages/tabBar/API.uvue
@@ -1,116 +1,143 @@
 <template>
-    <view class="uni-container">
-        <view class="uni-header-logo">
-            <image class="uni-header-image" src="/static/apiIndex.png"></image>
-        </view>
-        <view class="uni-hello-text">
-            <text class="hello-text">以下将演示uni-app接口能力，详细文档见：</text>
-            <u-link :href="'https://uniapp.dcloud.io/api/'" :text="'https://uniapp.dcloud.io/api/'"
-                :inWhiteList="true"></u-link>
-        </view>
-        <view class="uni-panel" v-for="(item, index) in list" :key="item.id">
-            <view class="uni-panel-h" :class="item.open ? 'uni-panel-h-on' : ''" @click="triggerCollapse(index, item)">
-                <text class="uni-panel-text" :class="item.enable == false ? 'text-disabled' : ''">{{item.name}}</text>
-                <image :src="item.pages.length > 0 ? item.open ? arrowUpIcon : arrowDownIcon : arrowRightIcon"
-                    class="uni-icon"></image>
-            </view>
-            <view class="uni-panel-c" v-if="item.open">
-                <view class="uni-navigate-item" v-for="(page,key) in item.pages" :key="key" @click="goDetailPage(page)">
-                    <text class="uni-navigate-text"
-                        :class="page.enable == false ? 'text-disabled' : ''">{{page.name}}</text>
-                    <image :src="arrowRightIcon" class="uni-icon"></image>
-                </view>
-            </view>
+  <scroll-view class="uni-container">
+    <view class="uni-header-logo">
+      <image class="uni-header-image" src="/static/apiIndex.png"></image>
+    </view>
+    <view class="uni-hello-text">
+      <text class="hello-text">以下将演示uni-app接口能力，详细文档见：</text>
+      <u-link
+        :href="'https://uniapp.dcloud.io/api/'"
+        :text="'https://uniapp.dcloud.io/api/'"
+        :inWhiteList="true"
+      ></u-link>
+    </view>
+    <view class="uni-panel" v-for="(item, index) in list" :key="item.id">
+      <view
+        class="uni-panel-h"
+        :class="item.open ? 'uni-panel-h-on' : ''"
+        @click="triggerCollapse(index, item)"
+      >
+        <text
+          class="uni-panel-text"
+          :class="item.enable == false ? 'text-disabled' : ''"
+          >{{ item.name }}</text
+        >
+        <image
+          :src="
+            item.pages.length > 0
+              ? item.open
+                ? arrowUpIcon
+                : arrowDownIcon
+              : arrowRightIcon
+          "
+          class="uni-icon"
+        ></image>
+      </view>
+      <view class="uni-panel-c" v-if="item.open">
+        <view
+          class="uni-navigate-item"
+          v-for="(page, key) in item.pages"
+          :key="key"
+          @click="goDetailPage(page)"
+        >
+          <text
+            class="uni-navigate-text"
+            :class="page.enable == false ? 'text-disabled' : ''"
+            >{{ page.name }}</text
+          >
+          <image :src="arrowRightIcon" class="uni-icon"></image>
         </view>
+      </view>
     </view>
+  </scroll-view>
 </template>
 
 <script lang="ts">
-    type Page = {
-        name : string,
-        enable ?: boolean,
-        url : string
-    }
-    type ListItem = {
-        id : string,
-        name : string,
-        open : boolean,
-        pages : Page[],
-        url ?: string,
-        enable ?: boolean
-    }
-    export default {
-        data() {
-            return {
-                list: [
-				{
-				    id: "base",
-				    name: "基础",
-				    open: false,
-				    pages: [
-                    {
-				            name: "getApp",
-                            url: "get-app",
-                        },
-                        {
-				            name: "getCurrentPages",
-				            url: "get-current-pages",
-                        },
-						{
-						    name: "事件总线event-bus",
-						    url: "event-bus",
-						},
-                        {
-                            name: "获取启动参数",
-                            url: "get-launch-options-sync",
-                        }
-				    ] as Page[],
-				},
-				{
-                    id: "page",
-                    name: "页面",
-                    open: false,
-                    pages: [
-                        {
-                            name: "页面跳转",
-                            url: "navigator",
-                        },
-						{
-						    name: "页面栈管理",
-						    url: "getCurrentPages",
-							enable: false
-						},
-						{
-						    name: "设置导航条标题",
-						    url: "set-navigation-bar-title",
-							enable: false
-                        },
-                        {
-						    name: "设置导航条颜色",
-						    url: "set-navigation-bar-color",
-                        },
-                        {
-                            name: "设置TabBar",
-                            url: "set-tabbar",
-							enable: false
-                        },
-                        {
-                            name: "下拉刷新",
-                            url: "pull-down-refresh",
-							enable: false
-                        },
-                        {
-                            name: "将页面滚动到指定位置",
-                            url: "page-scroll-to",
-                        },
-                    ] as Page[],
-                },
-				{
-				    id: "ui",
-				    name: "界面",
-				    open: false,
-				    pages: [
-				        /* {
+type Page = {
+  name: string
+  enable?: boolean
+  url: string
+}
+type ListItem = {
+  id: string
+  name: string
+  open: boolean
+  pages: Page[]
+  url?: string
+  enable?: boolean
+}
+export default {
+  data() {
+    return {
+      list: [
+        {
+          id: 'base',
+          name: '基础',
+          open: false,
+          pages: [
+            {
+              name: 'getApp',
+              url: 'get-app',
+            },
+            {
+              name: 'getCurrentPages',
+              url: 'get-current-pages',
+            },
+            {
+              name: '事件总线event-bus',
+              url: 'event-bus',
+            },
+            {
+              name: '获取启动参数',
+              url: 'get-launch-options-sync',
+            },
+          ] as Page[],
+        },
+        {
+          id: 'page',
+          name: '页面',
+          open: false,
+          pages: [
+            {
+              name: '页面跳转',
+              url: 'navigator',
+            },
+            {
+              name: '页面栈管理',
+              url: 'getCurrentPages',
+              enable: false,
+            },
+            {
+              name: '设置导航条标题',
+              url: 'set-navigation-bar-title',
+              enable: false,
+            },
+            {
+              name: '设置导航条颜色',
+              url: 'set-navigation-bar-color',
+            },
+            {
+              name: '设置TabBar',
+              url: 'set-tabbar',
+              enable: false,
+            },
+            {
+              name: '下拉刷新',
+              url: 'pull-down-refresh',
+              enable: false,
+            },
+            {
+              name: '将页面滚动到指定位置',
+              url: 'page-scroll-to',
+            },
+          ] as Page[],
+        },
+        {
+          id: 'ui',
+          name: '界面',
+          open: false,
+          pages: [
+            /* {
 				            name: "创建动画",
 				            url: "animation",
 							enable: false
@@ -125,70 +152,70 @@
 						    url: "intersection-observer",
 							enable: false
 						}, */
-				        {
-				            name: "节点信息",
-				            url: "nodes-info"
-				        },
-				        {
-				            name: "显示操作菜单",
-				            url: "action-sheet",
-				        },
-				        {
-				            name: "显示模态弹窗",
-				            url: "modal",
-				        },
-				        {
-				            name: "显示加载提示框",
-				            url: "show-loading",
-				        },
-				        {
-				            name: "显示消息提示框",
-				            url: "toast",
-                        },
-                        {
-                            name: "动态加载字体",
-                            url: "load-font-face",
-                        },
-				    ] as Page[],
-				},
-                {
-                    id: "device",
-                    name: "设备",
-                    open: false,
-                    pages: [
-                        {
-                            name: "获取设备网络状态",
-                            url: "get-network-type",
-                        },
-                        {
-                            name: "获取系统信息",
-                            url: "get-system-info",
-                        },
-						{
-						    name: "获取设备信息",
-						    url: "get-device-info",
-						},
-						{
-						    name: "获取APP基础信息",
-						    url: "get-app-base-info",
-						},
-						{
-						    name: "获取系统设置",
-						    url: "get-system-setting",
-						},
-						{
-						    name: "获取APP授权设置",
-						    url: "get-app-authorize-setting",
-						},
-						{
-						    name: "获取窗口信息",
-						    url: "get-window-info",
-						},
-						{
-						    name: "电量",
-						    url: "get-battery-info",
-						},
-                        /* {
+            {
+              name: '节点信息',
+              url: 'nodes-info',
+            },
+            {
+              name: '显示操作菜单',
+              url: 'action-sheet',
+            },
+            {
+              name: '显示模态弹窗',
+              url: 'modal',
+            },
+            {
+              name: '显示加载提示框',
+              url: 'show-loading',
+            },
+            {
+              name: '显示消息提示框',
+              url: 'toast',
+            },
+            {
+              name: '动态加载字体',
+              url: 'load-font-face',
+            },
+          ] as Page[],
+        },
+        {
+          id: 'device',
+          name: '设备',
+          open: false,
+          pages: [
+            {
+              name: '获取设备网络状态',
+              url: 'get-network-type',
+            },
+            {
+              name: '获取系统信息',
+              url: 'get-system-info',
+            },
+            {
+              name: '获取设备信息',
+              url: 'get-device-info',
+            },
+            {
+              name: '获取APP基础信息',
+              url: 'get-app-base-info',
+            },
+            {
+              name: '获取系统设置',
+              url: 'get-system-setting',
+            },
+            {
+              name: '获取APP授权设置',
+              url: 'get-app-authorize-setting',
+            },
+            {
+              name: '获取窗口信息',
+              url: 'get-window-info',
+            },
+            {
+              name: '电量',
+              url: 'get-battery-info',
+            },
+            /* {
                             name: "打电话",
                             url: "make-phone-call",
                         },
@@ -240,52 +267,52 @@
                             name: "监听方向传感器",
                             url: "/platforms/app-plus/orientation/orientation",
                         }, */
-                    ] as Page[],
-                },
-                {
-                    id: "network",
-                    name: "网络",
-                    open: false,
-                    pages: [
-                        {
-                            name: "发起一个请求",
-                            url: "request",
-                        },
-                        {
-                            name: "上传文件",
-                            url: "upload-file",
-                        },
-                        {
-                            name: "下载文件",
-                            url: "download-file",
-                        },
-                    ] as Page[],
-                },
-                {
-                    id: "websocket",
-                    name: "websocket",
-                    open: false,
-                    pages: [
-                        {
-                            name: "socketTask",
-                            url: "websocket-socketTask",
-                        },
-                        {
-                            name: "全局websocket",
-                            url: "websocket-global",
-                        },
-                    ] as Page[],
-                },
-                {
-                    id: "media",
-                    name: "媒体",
-                    open: false,
-                    pages: [
-                        {
-                            name: "图片选择和预览",
-                            url: "preview-image",
-                        },
-                        /* {
+          ] as Page[],
+        },
+        {
+          id: 'network',
+          name: '网络',
+          open: false,
+          pages: [
+            {
+              name: '发起一个请求',
+              url: 'request',
+            },
+            {
+              name: '上传文件',
+              url: 'upload-file',
+            },
+            {
+              name: '下载文件',
+              url: 'download-file',
+            },
+          ] as Page[],
+        },
+        {
+          id: 'websocket',
+          name: 'websocket',
+          open: false,
+          pages: [
+            {
+              name: 'socketTask',
+              url: 'websocket-socketTask',
+            },
+            {
+              name: '全局websocket',
+              url: 'websocket-global',
+            },
+          ] as Page[],
+        },
+        {
+          id: 'media',
+          name: '媒体',
+          open: false,
+          pages: [
+            {
+              name: '图片选择和预览',
+              url: 'preview-image',
+            },
+            /* {
                             name: "图片选择和拍照",
                             url: "image",
 							enable: false
@@ -314,18 +341,18 @@
                             name: "保存媒体到本地",
                             url: "save-media",
                         }, */
-                    ] as Page[],
-                },
-                {
-                    id: "location",
-                    name: "位置",
-                    open: false,
-                    pages: [
-                        {
-                            name: "获取当前位置",
-                            url: "get-location",
-                        },
-/*                        {
+          ] as Page[],
+        },
+        {
+          id: 'location',
+          name: '位置',
+          open: false,
+          pages: [
+            {
+              name: '获取当前位置',
+              url: 'get-location',
+            },
+            /*                        {
                             name: "使用地图查看位置",
                             url: "open-location",
                         },
@@ -341,20 +368,20 @@
                             name: "地图搜索",
                             url: "map-search",
                         }, */
-                    ] as Page[],
-                },
-                {
-                    id: "storage",
-                    name: "存储",
-                    open: false,
-                    pages: [
-                        {
-                            name: "storage（key-value存储）",
-                            url: "storage",
-                        }
-                    ] as Page[],
-                },
-/*                {
+          ] as Page[],
+        },
+        {
+          id: 'storage',
+          name: '存储',
+          open: false,
+          pages: [
+            {
+              name: 'storage（key-value存储）',
+              url: 'storage',
+            },
+          ] as Page[],
+        },
+        /*                {
                     id: "rewarded-video-ad",
                     url: "rewarded-video-ad",
                     name: "激励视频广告",
@@ -429,60 +456,61 @@
                         },
                     ] as Page[],
                 }, */
-                {
-                    id: "exit",
-                    name: "退出",
-                    open: false,
-                    pages: [
-                        {
-                            name: "exit退出",
-                            url: "exit",
-                            enable: false
-                        }
-                    ] as Page[],
-                }
-                ] as ListItem[],
-                arrowUpIcon: '/static/icons/arrow-up.png',
-                arrowDownIcon: '/static/icons/arrow-down.png',
-                arrowRightIcon: '/static/icons/arrow-right.png',
-            }
+        {
+          id: 'exit',
+          name: '退出',
+          open: false,
+          pages: [
+            {
+              name: 'exit退出',
+              url: 'exit',
+              enable: false,
+            },
+          ] as Page[],
         },
-        methods: {
-            triggerCollapse(index ?: number, item : ListItem) {
-                if (item.pages.length == 0) {
-                    const page : Page = {
-                        name: item.name,
-                        enable: item.enable,
-                        url: item.url!
-                    }
-                    this.goDetailPage(page);
-                    return;
-                }
-                for (var i = 0; i < this.list.length; ++i) {
-                    if (index == i) {
-                        this.list[i].open = !this.list[i].open;
-                    } else {
-                        this.list[i].open = false;
-                    }
-                }
-            },
-            goDetailPage(e : Page) {
-                if (e.enable == false) {
-                    uni.showToast({
-                        title: '暂不支持',
-						icon:"none"
-                    })
-                    return
-                }
-                const url = e.url.indexOf('platform') > -1 ? e.url : `/pages/API/${e.url}/${e.url}`
-                uni.navigateTo({
-                    url
-                })
-            }
-        }
+      ] as ListItem[],
+      arrowUpIcon: '/static/icons/arrow-up.png',
+      arrowDownIcon: '/static/icons/arrow-down.png',
+      arrowRightIcon: '/static/icons/arrow-right.png',
     }
+  },
+  methods: {
+    triggerCollapse(index?: number, item: ListItem) {
+      if (item.pages.length == 0) {
+        const page: Page = {
+          name: item.name,
+          enable: item.enable,
+          url: item.url!,
+        }
+        this.goDetailPage(page)
+        return
+      }
+      for (var i = 0; i < this.list.length; ++i) {
+        if (index == i) {
+          this.list[i].open = !this.list[i].open
+        } else {
+          this.list[i].open = false
+        }
+      }
+    },
+    goDetailPage(e: Page) {
+      if (e.enable == false) {
+        uni.showToast({
+          title: '暂不支持',
+          icon: 'none',
+        })
+        return
+      }
+      const url =
+        e.url.indexOf('platform') > -1 ? e.url : `/pages/API/${e.url}/${e.url}`
+      uni.navigateTo({
+        url,
+      })
+    },
+  },
+}
 </script>
 
 <style>
-    @import '../../common/uni-uvue.css';
-</style>
\ No newline at end of file
+@import '../../common/uni-uvue.css';
+</style>
diff --git a/pages/tabBar/CSS.uvue b/pages/tabBar/CSS.uvue
index 543ee7f8e982adedf1c2e826d380d7ad51abbbae..edcb0a53313f2a241ae6a051ec3c9f6098a67cf4 100644
--- a/pages/tabBar/CSS.uvue
+++ b/pages/tabBar/CSS.uvue
@@ -1,327 +1,370 @@
 <template>
-	<view class="uni-container">
-		<view class="uni-header-logo">
-			<image class="uni-header-image" src="/static/cssIndex.png"></image>
-		</view>
-		<view class="uni-hello-text">
-			<text class="hello-text">uni-app x目前已支持的CSS属性，展示样式仅供参考，文档详见：</text>
-			<u-link :href="'https://uniapp.dcloud.io/component/'" :text="'https://uniapp.dcloud.io/component/'" :inWhiteList="true"></u-link>
-		</view>
-		<view class="uni-panel" v-for="(item, index) in list" :key="item.id">
-			<view class="uni-panel-h" :class="item.open ? 'uni-panel-h-on' : ''" @click="triggerCollapse(index, item)">
-				<text class="uni-panel-text" :class="item.enable == false ? 'text-disabled' : ''">{{item.name}}</text>
-				<image :src="item.pages.length > 0 ? item.open ? arrowUpIcon : arrowDownIcon : arrowRightIcon" class="uni-icon"></image>
-			</view>
-			<view class="uni-panel-c" v-if="item.open">
-				<view class="uni-navigate-item" v-for="(page,key) in item.pages" :key="key" @click="goDetailPage(page)">
-					<text class="uni-navigate-text" :class="page.enable == false ? 'text-disabled' : ''">{{page.name}}</text>
-					<image :src="arrowRightIcon" class="uni-icon"></image>
-				</view>
-			</view>
-		</view>
-	</view>
+  <scroll-view class="uni-container">
+    <view class="uni-header-logo">
+      <image class="uni-header-image" src="/static/cssIndex.png"></image>
+    </view>
+    <view class="uni-hello-text">
+      <text class="hello-text"
+        >uni-app x目前已支持的CSS属性，展示样式仅供参考，文档详见：</text
+      >
+      <u-link
+        :href="'https://uniapp.dcloud.io/component/'"
+        :text="'https://uniapp.dcloud.io/component/'"
+        :inWhiteList="true"
+      ></u-link>
+    </view>
+    <view class="uni-panel" v-for="(item, index) in list" :key="item.id">
+      <view
+        class="uni-panel-h"
+        :class="item.open ? 'uni-panel-h-on' : ''"
+        @click="triggerCollapse(index, item)"
+      >
+        <text
+          class="uni-panel-text"
+          :class="item.enable == false ? 'text-disabled' : ''"
+          >{{ item.name }}</text
+        >
+        <image
+          :src="
+            item.pages.length > 0
+              ? item.open
+                ? arrowUpIcon
+                : arrowDownIcon
+              : arrowRightIcon
+          "
+          class="uni-icon"
+        ></image>
+      </view>
+      <view class="uni-panel-c" v-if="item.open">
+        <view
+          class="uni-navigate-item"
+          v-for="(page, key) in item.pages"
+          :key="key"
+          @click="goDetailPage(page)"
+        >
+          <text
+            class="uni-navigate-text"
+            :class="page.enable == false ? 'text-disabled' : ''"
+            >{{ page.name }}</text
+          >
+          <image :src="arrowRightIcon" class="uni-icon"></image>
+        </view>
+      </view>
+    </view>
+  </scroll-view>
 </template>
 
 <script lang="ts">
-	type Page = {
-		name : string,
-		enable ?: boolean,
-		url ?: string
-	}
-	type ListItem = {
-		id : string,
-		name : string,
-		open : boolean,
-		pages : Page[],
-		url ?: string,
-		enable ?: boolean
-	}
-	export default {
-		data() {
-			return {
-				list: [{
-					id: 'background',
-					name: 'background',
-					open: false,
-					pages: [
-						{
-							name: 'background-color',
-							url: '/pages/CSS/background/background-color'
-						},
-						{
-							name: 'background-image',
-							url: '/pages/CSS/background/background-image'
-						}
-					] as Page[]
-				}, {
-					id: 'border',
-					name: 'border',
-					open: false,
-					pages: [
-						{
-							name: 'border',
-							url: '/pages/CSS/border/border'
-						},
-						{
-							name: 'border-width',
-							url: '/pages/CSS/border/border-width'
-						},
-						{
-							name: 'border-style',
-							url: '/pages/CSS/border/border-style'
-						},
-						{
-							name: 'border-color',
-							url: '/pages/CSS/border/border-color'
-						},
-						{
-							name: 'border-radius',
-							url: '/pages/CSS/border/border-radius'
-						},
-						{
-							name: 'border属性复合示例',
-							url: '/pages/CSS/border/complex-border/complex-border'
-						}
-					] as Page[]
-				}, {
-					id: 'box-shadow',
-					name: 'box-shadow',
-					open: false,
-					pages: [
-						{
-							name: 'box-shadow',
-							url: '/pages/CSS/box-shadow/box-shadow'
-						},
-					] as Page[]
-				}, {
-					id: 'flex',
-					name: 'flex',
-					open: false,
-					pages: [
-						{
-							name: 'align-content',
-							url: '/pages/CSS/flex/align-content'
-						},
-						{
-							name: 'align-items',
-							url: '/pages/CSS/flex/align-items'
-						},
-						{
-							name: 'flex-basis',
-							url: '/pages/CSS/flex/flex-basis'
-						},
-						{
-							name: 'flex-direction',
-							url: '/pages/CSS/flex/flex-direction'
-						},
-						{
-							name: 'flex-flow',
-							url: '/pages/CSS/flex/flex-flow'
-						},
-						{
-							name: 'flex-grow',
-							url: '/pages/CSS/flex/flex-grow'
-						},
-						{
-							name: 'flex-shrink',
-							url: '/pages/CSS/flex/flex-shrink'
-						},
-						{
-							name: 'flex',
-							url: '/pages/CSS/flex/flex'
-						},
-						{
-							name: 'justify-content',
-							url: '/pages/CSS/flex/justify-content'
-						}
-					] as Page[]
-				}, {
-					id: 'layout',
-					name: 'layout',
-					open: false,
-					pages: [
-						{
-							name: 'height',
-							url: '/pages/CSS/layout/height'
-						},
-						{
-							name: 'max-height',
-							url: '/pages/CSS/layout/max-height'
-						},
-						{
-							name: 'max-width',
-							url: '/pages/CSS/layout/max-width'
-						},
-						{
-							name: 'min-height',
-							url: '/pages/CSS/layout/min-height'
-						},
-						{
-							name: 'min-width',
-							url: '/pages/CSS/layout/min-width'
-						},
-						{
-							name: 'position',
-							url: '/pages/CSS/layout/position'
-						},
-						{
-							name: 'width',
-							url: '/pages/CSS/layout/width'
-						},
-						{
-							name: 'visibility',
-							url: '/pages/CSS/layout/visibility'
-						}
-					] as Page[]
-				}, {
-					id: 'margin',
-					name: 'margin',
-					open: false,
-					pages: [
-						{
-							name: 'margin-bottom',
-							url: '/pages/CSS/margin/margin-bottom'
-						},
-						{
-							name: 'margin-left',
-							url: '/pages/CSS/margin/margin-left'
-						},
-						{
-							name: 'margin-right',
-							url: '/pages/CSS/margin/margin-right'
-						},
-						{
-							name: 'margin-top',
-							url: '/pages/CSS/margin/margin-top'
-						}, {
-							name: 'margin',
-							url: '/pages/CSS/margin/margin'
-						}
-					] as Page[]
-				}, {
-					id: 'padding',
-					name: 'padding',
-					open: false,
-					pages: [
-						{
-							name: 'padding-bottom',
-							url: '/pages/CSS/padding/padding-bottom'
-						},
-						{
-							name: 'padding-left',
-							url: '/pages/CSS/padding/padding-left'
-						},
-						{
-							name: 'padding-right',
-							url: '/pages/CSS/padding/padding-right'
-						},
-						{
-							name: 'padding-top',
-							url: '/pages/CSS/padding/padding-top'
-						}, {
-							name: 'padding',
-							url: '/pages/CSS/padding/padding'
-						}
-					] as Page[]
-				}, {
-					id: 'text',
-					name: 'text',
-					open: false,
-					pages: [
-						{
-							name: 'color',
-							url: '/pages/CSS/text/color'
-						},
-						{
-							name: 'font-family',
-							url: '/pages/CSS/text/font-family'
-						},
-						{
-							name: 'font-size',
-							url: '/pages/CSS/text/font-size'
-						},
-						{
-							name: 'font-style',
-							url: '/pages/CSS/text/font-style'
-						},
-						{
-							name: 'font-weight',
-							url: '/pages/CSS/text/font-weight'
-						},
-						{
-							name: 'line-height',
-							url: '/pages/CSS/text/line-height'
-						},
-						{
-							name: 'text-align',
-							url: '/pages/CSS/text/text-align'
-						},
-						{
-							name: 'text-overflow',
-							url: '/pages/CSS/text/text-overflow'
-						},
-						{
-							name: 'text-decoration-line',
-							url: '/pages/CSS/text/text-decoration-line'
-						}
-					] as Page[]
-				}, {
-					id: 'animate',
-					name: '动画',
-					open: false,
-					pages: [
-						{
-							name: 'transition',
-							url: '/pages/CSS/transition/transition'
-						},
-						{
-							name: 'transform',
-							url: '/pages/CSS/transform/transform'
-						}
-					] as Page[]
-				}
-				] as ListItem[],
-				arrowUpIcon: '/static/icons/arrow-up.png',
-				arrowDownIcon: '/static/icons/arrow-down.png',
-				arrowRightIcon: '/static/icons/arrow-right.png',
-			}
-		},
-		methods: {
-			triggerCollapse(index ?: number, item : ListItem) {
-				if (item.pages.length == 0) {
-					const page : Page = {
-						name: item.name,
-						enable: item.enable,
-						url: item.url
-					}
-					this.goDetailPage(page);
-					return;
-				}
-				for (var i = 0; i < this.list.length; ++i) {
-					if (index == i) {
-						this.list[i].open = !this.list[i].open;
-					} else {
-						this.list[i].open = false;
-					}
-				}
-			},
-			goDetailPage(e : Page) {
-				if (e.enable == false) {
-					uni.showToast({
-						icon: 'none',
-						title: '暂不支持'
-					})
-					return
-				}
-				const url = e.url != null ? e.url! : `/pages/CSS/${e.name}/${e.name}`
-				uni.navigateTo({
-					url
-				})
-			}
-		}
-	}
+type Page = {
+  name: string
+  enable?: boolean
+  url?: string
+}
+type ListItem = {
+  id: string
+  name: string
+  open: boolean
+  pages: Page[]
+  url?: string
+  enable?: boolean
+}
+export default {
+  data() {
+    return {
+      list: [
+        {
+          id: 'background',
+          name: 'background',
+          open: false,
+          pages: [
+            {
+              name: 'background-color',
+              url: '/pages/CSS/background/background-color',
+            },
+            {
+              name: 'background-image',
+              url: '/pages/CSS/background/background-image',
+            },
+          ] as Page[],
+        },
+        {
+          id: 'border',
+          name: 'border',
+          open: false,
+          pages: [
+            {
+              name: 'border',
+              url: '/pages/CSS/border/border',
+            },
+            {
+              name: 'border-width',
+              url: '/pages/CSS/border/border-width',
+            },
+            {
+              name: 'border-style',
+              url: '/pages/CSS/border/border-style',
+            },
+            {
+              name: 'border-color',
+              url: '/pages/CSS/border/border-color',
+            },
+            {
+              name: 'border-radius',
+              url: '/pages/CSS/border/border-radius',
+            },
+            {
+              name: 'border属性复合示例',
+              url: '/pages/CSS/border/complex-border/complex-border',
+            },
+          ] as Page[],
+        },
+        {
+          id: 'box-shadow',
+          name: 'box-shadow',
+          open: false,
+          pages: [
+            {
+              name: 'box-shadow',
+              url: '/pages/CSS/box-shadow/box-shadow',
+            },
+          ] as Page[],
+        },
+        {
+          id: 'flex',
+          name: 'flex',
+          open: false,
+          pages: [
+            {
+              name: 'align-content',
+              url: '/pages/CSS/flex/align-content',
+            },
+            {
+              name: 'align-items',
+              url: '/pages/CSS/flex/align-items',
+            },
+            {
+              name: 'flex-basis',
+              url: '/pages/CSS/flex/flex-basis',
+            },
+            {
+              name: 'flex-direction',
+              url: '/pages/CSS/flex/flex-direction',
+            },
+            {
+              name: 'flex-flow',
+              url: '/pages/CSS/flex/flex-flow',
+            },
+            {
+              name: 'flex-grow',
+              url: '/pages/CSS/flex/flex-grow',
+            },
+            {
+              name: 'flex-shrink',
+              url: '/pages/CSS/flex/flex-shrink',
+            },
+            {
+              name: 'flex',
+              url: '/pages/CSS/flex/flex',
+            },
+            {
+              name: 'justify-content',
+              url: '/pages/CSS/flex/justify-content',
+            },
+          ] as Page[],
+        },
+        {
+          id: 'layout',
+          name: 'layout',
+          open: false,
+          pages: [
+            {
+              name: 'height',
+              url: '/pages/CSS/layout/height',
+            },
+            {
+              name: 'max-height',
+              url: '/pages/CSS/layout/max-height',
+            },
+            {
+              name: 'max-width',
+              url: '/pages/CSS/layout/max-width',
+            },
+            {
+              name: 'min-height',
+              url: '/pages/CSS/layout/min-height',
+            },
+            {
+              name: 'min-width',
+              url: '/pages/CSS/layout/min-width',
+            },
+            {
+              name: 'position',
+              url: '/pages/CSS/layout/position',
+            },
+            {
+              name: 'width',
+              url: '/pages/CSS/layout/width',
+            },
+            {
+              name: 'visibility',
+              url: '/pages/CSS/layout/visibility',
+            },
+          ] as Page[],
+        },
+        {
+          id: 'margin',
+          name: 'margin',
+          open: false,
+          pages: [
+            {
+              name: 'margin-bottom',
+              url: '/pages/CSS/margin/margin-bottom',
+            },
+            {
+              name: 'margin-left',
+              url: '/pages/CSS/margin/margin-left',
+            },
+            {
+              name: 'margin-right',
+              url: '/pages/CSS/margin/margin-right',
+            },
+            {
+              name: 'margin-top',
+              url: '/pages/CSS/margin/margin-top',
+            },
+            {
+              name: 'margin',
+              url: '/pages/CSS/margin/margin',
+            },
+          ] as Page[],
+        },
+        {
+          id: 'padding',
+          name: 'padding',
+          open: false,
+          pages: [
+            {
+              name: 'padding-bottom',
+              url: '/pages/CSS/padding/padding-bottom',
+            },
+            {
+              name: 'padding-left',
+              url: '/pages/CSS/padding/padding-left',
+            },
+            {
+              name: 'padding-right',
+              url: '/pages/CSS/padding/padding-right',
+            },
+            {
+              name: 'padding-top',
+              url: '/pages/CSS/padding/padding-top',
+            },
+            {
+              name: 'padding',
+              url: '/pages/CSS/padding/padding',
+            },
+          ] as Page[],
+        },
+        {
+          id: 'text',
+          name: 'text',
+          open: false,
+          pages: [
+            {
+              name: 'color',
+              url: '/pages/CSS/text/color',
+            },
+            {
+              name: 'font-family',
+              url: '/pages/CSS/text/font-family',
+            },
+            {
+              name: 'font-size',
+              url: '/pages/CSS/text/font-size',
+            },
+            {
+              name: 'font-style',
+              url: '/pages/CSS/text/font-style',
+            },
+            {
+              name: 'font-weight',
+              url: '/pages/CSS/text/font-weight',
+            },
+            {
+              name: 'line-height',
+              url: '/pages/CSS/text/line-height',
+            },
+            {
+              name: 'text-align',
+              url: '/pages/CSS/text/text-align',
+            },
+            {
+              name: 'text-overflow',
+              url: '/pages/CSS/text/text-overflow',
+            },
+            {
+              name: 'text-decoration-line',
+              url: '/pages/CSS/text/text-decoration-line',
+            },
+          ] as Page[],
+        },
+        {
+          id: 'animate',
+          name: '动画',
+          open: false,
+          pages: [
+            {
+              name: 'transition',
+              url: '/pages/CSS/transition/transition',
+            },
+            {
+              name: 'transform',
+              url: '/pages/CSS/transform/transform',
+            },
+          ] as Page[],
+        },
+      ] as ListItem[],
+      arrowUpIcon: '/static/icons/arrow-up.png',
+      arrowDownIcon: '/static/icons/arrow-down.png',
+      arrowRightIcon: '/static/icons/arrow-right.png',
+    }
+  },
+  methods: {
+    triggerCollapse(index?: number, item: ListItem) {
+      if (item.pages.length == 0) {
+        const page: Page = {
+          name: item.name,
+          enable: item.enable,
+          url: item.url,
+        }
+        this.goDetailPage(page)
+        return
+      }
+      for (var i = 0; i < this.list.length; ++i) {
+        if (index == i) {
+          this.list[i].open = !this.list[i].open
+        } else {
+          this.list[i].open = false
+        }
+      }
+    },
+    goDetailPage(e: Page) {
+      if (e.enable == false) {
+        uni.showToast({
+          icon: 'none',
+          title: '暂不支持',
+        })
+        return
+      }
+      const url = e.url != null ? e.url! : `/pages/CSS/${e.name}/${e.name}`
+      uni.navigateTo({
+        url,
+      })
+    },
+  },
+}
 </script>
 
 <style>
-	@import '../../common/uni-uvue.css';
-</style>
\ No newline at end of file
+@import '../../common/uni-uvue.css';
+</style>
diff --git a/pages/tabBar/component.uvue b/pages/tabBar/component.uvue
index 4ce3a748f48203b6476ee4bd7fcc38301b0f493c..c00a2021f6161048a33844c0a9bf0a44714de592 100644
--- a/pages/tabBar/component.uvue
+++ b/pages/tabBar/component.uvue
@@ -1,62 +1,92 @@
 <template>
-	<view class="uni-container">
-		<view class="uni-header-logo">
-			<image class="uni-header-image" src="/static/componentIndex.png"></image>
-		</view>
-		<view class="uni-hello-text">
-			<text class="hello-text">uni-app内置组件，展示样式仅供参考，文档详见：</text>
-			<u-link :href="'https://uniapp.dcloud.io/component/'" :text="'https://uniapp.dcloud.io/component/'"
-				:inWhiteList="true"></u-link>
-		</view>
-		<view class="uni-panel" v-for="(item, index) in list" :key="item.id">
-			<view class="uni-panel-h" :class="item.open ? 'uni-panel-h-on' : ''" @click="triggerCollapse(index, item)">
-				<text class="uni-panel-text" :class="item.enable == false ? 'text-disabled' : ''">{{item.name}}</text>
-				<image :src="item.pages.length > 0 ? item.open ? arrowUpIcon : arrowDownIcon : arrowRightIcon"
-					class="uni-icon"></image>
-			</view>
-			<view class="uni-panel-c" v-if="item.open">
-				<view class="uni-navigate-item" v-for="(page,key) in item.pages" :key="key" @click="goDetailPage(page)">
-					<text class="uni-navigate-text"
-						:class="page.enable == false ? 'text-disabled' : ''">{{page.name}}</text>
-					<image :src="arrowRightIcon" class="uni-icon"></image>
-				</view>
-			</view>
-		</view>
-	</view>
+  <scroll-view class="uni-container">
+    <view class="uni-header-logo">
+      <image class="uni-header-image" src="/static/componentIndex.png"></image>
+    </view>
+    <view class="uni-hello-text">
+      <text class="hello-text"
+        >uni-app内置组件，展示样式仅供参考，文档详见：</text
+      >
+      <u-link
+        :href="'https://uniapp.dcloud.io/component/'"
+        :text="'https://uniapp.dcloud.io/component/'"
+        :inWhiteList="true"
+      ></u-link>
+    </view>
+    <view class="uni-panel" v-for="(item, index) in list" :key="item.id">
+      <view
+        class="uni-panel-h"
+        :class="item.open ? 'uni-panel-h-on' : ''"
+        @click="triggerCollapse(index, item)"
+      >
+        <text
+          class="uni-panel-text"
+          :class="item.enable == false ? 'text-disabled' : ''"
+          >{{ item.name }}</text
+        >
+        <image
+          :src="
+            item.pages.length > 0
+              ? item.open
+                ? arrowUpIcon
+                : arrowDownIcon
+              : arrowRightIcon
+          "
+          class="uni-icon"
+        ></image>
+      </view>
+      <view class="uni-panel-c" v-if="item.open">
+        <view
+          class="uni-navigate-item"
+          v-for="(page, key) in item.pages"
+          :key="key"
+          @click="goDetailPage(page)"
+        >
+          <text
+            class="uni-navigate-text"
+            :class="page.enable == false ? 'text-disabled' : ''"
+            >{{ page.name }}</text
+          >
+          <image :src="arrowRightIcon" class="uni-icon"></image>
+        </view>
+      </view>
+    </view>
+  </scroll-view>
 </template>
 
 <script lang="ts">
-	type Page = {
-		name : string,
-		enable ?: boolean,
-		url ?: string
-	}
-	type ListItem = {
-		id : string,
-		name : string,
-		open : boolean,
-		pages : Page[],
-		url ?: string,
-		enable ?: boolean
-	}
-	export default {
-		data() {
-			return {
-				list: [{
-					id: 'view',
-					name: '视图容器',
-					open: false,
-					pages: [
-						{
-							name: 'view',
-						},
-						{
-							name: 'scroll-view',
-						},
-						{
-							name: 'swiper',
-						},
-						/*
+type Page = {
+  name: string
+  enable?: boolean
+  url?: string
+}
+type ListItem = {
+  id: string
+  name: string
+  open: boolean
+  pages: Page[]
+  url?: string
+  enable?: boolean
+}
+export default {
+  data() {
+    return {
+      list: [
+        {
+          id: 'view',
+          name: '视图容器',
+          open: false,
+          pages: [
+            {
+              name: 'view',
+            },
+            {
+              name: 'scroll-view',
+            },
+            {
+              name: 'swiper',
+            },
+            /*
 						{
 							name: 'movable-view',
 							enable: false
@@ -66,75 +96,83 @@
 							enable: false
 						},
 						*/
-						{
-							name: 'list（新闻）',
-							url: "/pages/component/list/list",
-						},
-						{
-							name: 'list',
-							url: "/pages/component/long-list/long-list",
-						}
-					] as Page[]
-				}, {
-					id: 'content',
-					name: '基础内容',
-					open: false,
-					pages: [
-						{
-							name: 'text',
-						},
-						{
-							name: 'rich-text',
-							enable: false
-						},
-						{
-							name: 'progress',
-						}
-					] as Page[]
-				}, {
-					id: 'form',
-					name: '表单组件',
-					open: false,
-					pages: [
-						{
-							name: 'button',
-						},
-						{
-							name: 'checkbox',
-						},
-						/* {
+            {
+              name: 'list（新闻）',
+              url: '/pages/component/list/list',
+            },
+            {
+              name: 'list',
+              url: '/pages/component/long-list/long-list',
+            },
+          ] as Page[],
+        },
+        {
+          id: 'content',
+          name: '基础内容',
+          open: false,
+          pages: [
+            {
+              name: 'text',
+            },
+            {
+              name: 'rich-text',
+              enable: false,
+            },
+            {
+              name: 'progress',
+            },
+          ] as Page[],
+        },
+        {
+          id: 'form',
+          name: '表单组件',
+          open: false,
+          pages: [
+            {
+              name: 'button',
+            },
+            {
+              name: 'checkbox',
+            },
+            /* {
 							name: 'form',
 							enable: false
 						}, */
-						{
-							name: 'input',
-							/* }, {
+            {
+              name: 'input',
+              /* }, {
 								name: 'label',
 								enable: false
 							}, {
 								name: 'picker',
 								enable: false */
-						}, {
-							name: 'picker-view'
-						}, {
-							name: 'radio',
-						}, {
-							name: 'slider',
-						}, {
-							name: 'slider-100',
-						}, {
-							name: 'switch',
-						}, {
-							name: 'textarea',
-						},
-						/*
+            },
+            {
+              name: 'picker-view',
+            },
+            {
+              name: 'radio',
+            },
+            {
+              name: 'slider',
+            },
+            {
+              name: 'slider-100',
+            },
+            {
+              name: 'switch',
+            },
+            {
+              name: 'textarea',
+            },
+            /*
 						{
 							name: 'editor',
 							enable: false
 						},
 						*/
-					] as Page[]
-					/* }, {
+          ] as Page[],
+          /* }, {
 						id: 'nav',
 						name: '导航',
 						open: false,
@@ -142,22 +180,27 @@
 							name: 'navigator',
 							enable: false
 						}] as Page[] */
-				}, {
-					id: 'media',
-					name: '媒体组件',
-					open: false,
-					pages: [{
-						name: 'image',
-						enable: true
-					}, {
-						name: 'video',
-						enable: true
-					}, {
-						name: 'animation-view',
-						enable: false
-					}] as Page[]
-				},
-				/*
+        },
+        {
+          id: 'media',
+          name: '媒体组件',
+          open: false,
+          pages: [
+            {
+              name: 'image',
+              enable: true,
+            },
+            {
+              name: 'video',
+              enable: true,
+            },
+            {
+              name: 'animation-view',
+              enable: false,
+            },
+          ] as Page[],
+        },
+        /*
 				{
 					id: 'map',
 					name: '地图',
@@ -180,24 +223,24 @@
 					] as Page[]
 				},
 				*/
-				{
-					id: 'web-view',
-					name: '网页',
-					open: false,
-					pages: [
-						{
-							name: '网络网页',
-							enable: true,
-							url: '/pages/component/web-view/web-view'
-						},
-						{
-							name: '本地网页',
-							enable: true,
-							url: '/pages/component/web-view-local/web-view-local'
-						}
-					] as Page[]
-				},
-				/*
+        {
+          id: 'web-view',
+          name: '网页',
+          open: false,
+          pages: [
+            {
+              name: '网络网页',
+              enable: true,
+              url: '/pages/component/web-view/web-view',
+            },
+            {
+              name: '本地网页',
+              enable: true,
+              url: '/pages/component/web-view-local/web-view-local',
+            },
+          ] as Page[],
+        },
+        /*
 				{
 					id: 'ad',
 					url: 'ad',
@@ -207,64 +250,66 @@
 					pages: [] as Page[]
 				}
 				*/
-				{
-					id: "general-attr-event",
-					name: "通用属性和事件",
-					open: false,
-					pages: [
-						{
-							name: "通用属性",
-							url: "general-attr",
-							enable: false
-						},{
-							name: "通用事件",
-							url: "general-event",
-							enable: false
-						},
-					] as Page[],
-				},
-				] as ListItem[],
-				arrowUpIcon: '/static/icons/arrow-up.png',
-				arrowDownIcon: '/static/icons/arrow-down.png',
-				arrowRightIcon: '/static/icons/arrow-right.png',
-			}
-		},
-		methods: {
-			triggerCollapse(index ?: number, item : ListItem) {
-				if (item.pages.length == 0) {
-					const page : Page = {
-						name: item.name,
-						enable: item.enable,
-						url: item.url
-					}
-					this.goDetailPage(page);
-					return;
-				}
-				for (var i = 0; i < this.list.length; ++i) {
-					if (index == i) {
-						this.list[i].open = !this.list[i].open;
-					} else {
-						this.list[i].open = false;
-					}
-				}
-			},
-			goDetailPage(e : Page) {
-				if (e.enable == false) {
-					uni.showToast({
-						title: '暂不支持',
-						icon: 'none'
-					})
-					return
-				}
-				const url = e.url != null ? e.url! : `/pages/component/${e.name}/${e.name}`
-				uni.navigateTo({
-					url
-				})
-			}
-		}
-	}
+        {
+          id: 'general-attr-event',
+          name: '通用属性和事件',
+          open: false,
+          pages: [
+            {
+              name: '通用属性',
+              url: 'general-attr',
+              enable: false,
+            },
+            {
+              name: '通用事件',
+              url: 'general-event',
+              enable: false,
+            },
+          ] as Page[],
+        },
+      ] as ListItem[],
+      arrowUpIcon: '/static/icons/arrow-up.png',
+      arrowDownIcon: '/static/icons/arrow-down.png',
+      arrowRightIcon: '/static/icons/arrow-right.png',
+    }
+  },
+  methods: {
+    triggerCollapse(index?: number, item: ListItem) {
+      if (item.pages.length == 0) {
+        const page: Page = {
+          name: item.name,
+          enable: item.enable,
+          url: item.url,
+        }
+        this.goDetailPage(page)
+        return
+      }
+      for (var i = 0; i < this.list.length; ++i) {
+        if (index == i) {
+          this.list[i].open = !this.list[i].open
+        } else {
+          this.list[i].open = false
+        }
+      }
+    },
+    goDetailPage(e: Page) {
+      if (e.enable == false) {
+        uni.showToast({
+          title: '暂不支持',
+          icon: 'none',
+        })
+        return
+      }
+      const url =
+        e.url != null ? e.url! : `/pages/component/${e.name}/${e.name}`
+      uni.navigateTo({
+        url,
+      })
+    },
+  },
+}
 </script>
 
 <style>
-	@import '../../common/uni-uvue.css';
-</style>
\ No newline at end of file
+@import '../../common/uni-uvue.css';
+</style>
diff --git a/pages/tabBar/template.uvue b/pages/tabBar/template.uvue
index dff50503809290a6efdf54cf11604b172dcec69e..6e87be7f6984c7354b73d0dc0951b389cd5c6081 100644
--- a/pages/tabBar/template.uvue
+++ b/pages/tabBar/template.uvue
@@ -1,177 +1,211 @@
 <template>
-	<view class="uni-container">
-		<view class="uni-header-logo">
-			<image class="uni-header-image" src="/static/templateIndex.png"></image>
-		</view>
-		<view class="uni-hello-text">
-			<text class="hello-text">以下是部分模板示例，更多模板见插件市场：</text>
-			<u-link class="hello-link" href="https://ext.dcloud.net.cn" :text="'https://ext.dcloud.net.cn'"
-				:inWhiteList="true"></u-link>
-		</view>
-		<view class="uni-panel" v-for="(item, index) in list" :key="item.id">
-			<view class="uni-panel-h" :class="item.open ? 'uni-panel-h-on' : ''" @click="triggerCollapse(index, item)">
-				<text class="uni-panel-text" :class="item.enable == false ? 'text-disabled' : ''">{{item.name}}</text>
-				<image :src="item.pages.length > 0 ? item.open ? arrowUpIcon : arrowDownIcon : arrowRightIcon"
-					class="uni-icon">
-				</image>
-			</view>
-			<view class="uni-panel-c" v-if="item.open">
-				<view class="uni-navigate-item" v-for="(page,key) in item.pages" :key="key" @click="goDetailPage(page)">
-					<text class="uni-navigate-text"
-						:class="page.enable == false ? 'text-disabled' : ''">{{page.name}}</text>
-					<image :src="arrowRightIcon" class="uni-icon"></image>
-				</view>
-			</view>
-		</view>
-	</view>
+  <scroll-view class="uni-container">
+    <view class="uni-header-logo">
+      <image class="uni-header-image" src="/static/templateIndex.png"></image>
+    </view>
+    <view class="uni-hello-text">
+      <text class="hello-text">以下是部分模板示例，更多模板见插件市场：</text>
+      <u-link
+        class="hello-link"
+        href="https://ext.dcloud.net.cn"
+        :text="'https://ext.dcloud.net.cn'"
+        :inWhiteList="true"
+      ></u-link>
+    </view>
+    <view class="uni-panel" v-for="(item, index) in list" :key="item.id">
+      <view
+        class="uni-panel-h"
+        :class="item.open ? 'uni-panel-h-on' : ''"
+        @click="triggerCollapse(index, item)"
+      >
+        <text
+          class="uni-panel-text"
+          :class="item.enable == false ? 'text-disabled' : ''"
+          >{{ item.name }}</text
+        >
+        <image
+          :src="
+            item.pages.length > 0
+              ? item.open
+                ? arrowUpIcon
+                : arrowDownIcon
+              : arrowRightIcon
+          "
+          class="uni-icon"
+        >
+        </image>
+      </view>
+      <view class="uni-panel-c" v-if="item.open">
+        <view
+          class="uni-navigate-item"
+          v-for="(page, key) in item.pages"
+          :key="key"
+          @click="goDetailPage(page)"
+        >
+          <text
+            class="uni-navigate-text"
+            :class="page.enable == false ? 'text-disabled' : ''"
+            >{{ page.name }}</text
+          >
+          <image :src="arrowRightIcon" class="uni-icon"></image>
+        </view>
+      </view>
+    </view>
+  </scroll-view>
 </template>
 
 <script lang="ts">
-	type Page = {
-		name : string,
-		enable ?: boolean,
-		url : string
-	}
+type Page = {
+  name: string
+  enable?: boolean
+  url: string
+}
 
-	type ListItem = {
-		id : string,
-		name : string,
-		open : boolean,
-		pages : Page[],
-		url ?: string,
-		enable ?: boolean
-	}
-	export default {
-		data() {
-			return {
-				list: [
-					{
-						id: "long-list",
-						url: "long-list",
-						name: "复杂长列表",
-						open: false,
-						enable: false,
-						pages: [] as Page[]
-					},{
-						id: "scroll-fold-nav",
-						url: "scroll-fold-nav",
-						name: "随滚动折叠的导航栏",
-						open: false,
-						pages: [] as Page[]
-					},{
-						id: "scroll-fold-nav2",
-						url: "scroll-fold-nav2",
-						name: "随滚动折叠的导航栏2",
-						open: false,
-						pages: [] as Page[]
-					}, {
-						id: "swiper-list",
-						url: "swiper-list",
-						name: "swiper-list",
-						open: false,
-						enable: false,
-						pages: [] as Page[]
-
-					}, {
-						id: "custom-refresher",
-						url: "custom-refresher",
-						name: "自定义下拉刷新",
-						open: false,
-						pages: [] as Page[]
-					},
-					{
-						id: "pull-zoom-image",
-						url: "pull-zoom-image",
-						name: "下拉缩放顶部封面图",
-						open: false,
-						enable: false,
-						pages: [] as Page[]
-					},
-					{
-						id: "show-search-with-scroll",
-						url: "show-search-with-scroll",
-						name: "滚动后自动显隐的搜索框",
-						open: false,
-						enable: false,
-						pages: [] as Page[]
-					},
-					{
-						id: "swiper-vertical-video",
-						url: "swiper-vertical-video",
-						name: "竖滑视频",
-						open: false,
-						pages: [] as Page[]
-					},
-					{
-						id: "scroll-sticky",
-						url: "scroll-sticky",
-						name: "吸顶",
-						open: false,
-						pages: [] as Page[]
-					},
-					{
-						id: "half-screen",
-						url: "half-screen",
-						name: "半屏弹窗",
-						open: false,
-						pages: [] as Page[]
-					},
-					{
-						id: "drop-card",
-						url: "drop-card",
-						name: "划走式卡片",
-						open: false,
-						pages: [] as Page[]
-					},
-                    {
-                        id: "calendar",
-                        url: "calendar",
-                        name: "日历",
-                        open: false,
-                        pages: [] as Page[]
-                    }
-				] as ListItem[],
-				arrowUpIcon: '/static/icons/arrow-up.png',
-				arrowDownIcon: '/static/icons/arrow-down.png',
-				arrowRightIcon: '/static/icons/arrow-right.png',
-			}
-		},
-		methods: {
-			triggerCollapse(index ?: number, item : ListItem) {
-				if (item.pages.length == 0) {
-					const page : Page = {
-						name: item.name,
-						enable: item.enable,
-						url: item.url!
-					}
-					this.goDetailPage(page);
-					return;
-				}
-				for (var i = 0; i < this.list.length; ++i) {
-					if (index == i) {
-						this.list[i].open = !this.list[i].open;
-					} else {
-						this.list[i].open = false;
-					}
-				}
-			},
-			goDetailPage(e : Page) {
-				if (e.enable == false) {
-					uni.showToast({
-						icon: 'none',
-						title: '暂不支持'
-					})
-					return
-				}
-				const url = e.url.indexOf('platform') > -1 ? e.url : `/pages/template/${e.url}/${e.url}`
-				uni.navigateTo({
-					url
-				})
-			}
-		}
-	}
+type ListItem = {
+  id: string
+  name: string
+  open: boolean
+  pages: Page[]
+  url?: string
+  enable?: boolean
+}
+export default {
+  data() {
+    return {
+      list: [
+        {
+          id: 'long-list',
+          url: 'long-list',
+          name: '复杂长列表',
+          open: false,
+          enable: false,
+          pages: [] as Page[],
+        },
+        {
+          id: 'scroll-fold-nav',
+          url: 'scroll-fold-nav',
+          name: '随滚动折叠的导航栏',
+          open: false,
+          pages: [] as Page[],
+        },
+        {
+          id: 'scroll-fold-nav2',
+          url: 'scroll-fold-nav2',
+          name: '随滚动折叠的导航栏2',
+          open: false,
+          pages: [] as Page[],
+        },
+        {
+          id: 'swiper-list',
+          url: 'swiper-list',
+          name: 'swiper-list',
+          open: false,
+          enable: false,
+          pages: [] as Page[],
+        },
+        {
+          id: 'custom-refresher',
+          url: 'custom-refresher',
+          name: '自定义下拉刷新',
+          open: false,
+          pages: [] as Page[],
+        },
+        {
+          id: 'pull-zoom-image',
+          url: 'pull-zoom-image',
+          name: '下拉缩放顶部封面图',
+          open: false,
+          enable: false,
+          pages: [] as Page[],
+        },
+        {
+          id: 'show-search-with-scroll',
+          url: 'show-search-with-scroll',
+          name: '滚动后自动显隐的搜索框',
+          open: false,
+          enable: false,
+          pages: [] as Page[],
+        },
+        {
+          id: 'swiper-vertical-video',
+          url: 'swiper-vertical-video',
+          name: '竖滑视频',
+          open: false,
+          pages: [] as Page[],
+        },
+        {
+          id: 'scroll-sticky',
+          url: 'scroll-sticky',
+          name: '吸顶',
+          open: false,
+          pages: [] as Page[],
+        },
+        {
+          id: 'half-screen',
+          url: 'half-screen',
+          name: '半屏弹窗',
+          open: false,
+          pages: [] as Page[],
+        },
+        {
+          id: 'drop-card',
+          url: 'drop-card',
+          name: '划走式卡片',
+          open: false,
+          pages: [] as Page[],
+        },
+        {
+          id: 'calendar',
+          url: 'calendar',
+          name: '日历',
+          open: false,
+          pages: [] as Page[],
+        },
+      ] as ListItem[],
+      arrowUpIcon: '/static/icons/arrow-up.png',
+      arrowDownIcon: '/static/icons/arrow-down.png',
+      arrowRightIcon: '/static/icons/arrow-right.png',
+    }
+  },
+  methods: {
+    triggerCollapse(index?: number, item: ListItem) {
+      if (item.pages.length == 0) {
+        const page: Page = {
+          name: item.name,
+          enable: item.enable,
+          url: item.url!,
+        }
+        this.goDetailPage(page)
+        return
+      }
+      for (var i = 0; i < this.list.length; ++i) {
+        if (index == i) {
+          this.list[i].open = !this.list[i].open
+        } else {
+          this.list[i].open = false
+        }
+      }
+    },
+    goDetailPage(e: Page) {
+      if (e.enable == false) {
+        uni.showToast({
+          icon: 'none',
+          title: '暂不支持',
+        })
+        return
+      }
+      const url =
+        e.url.indexOf('platform') > -1
+          ? e.url
+          : `/pages/template/${e.url}/${e.url}`
+      uni.navigateTo({
+        url,
+      })
+    },
+  },
+}
 </script>
 
 <style>
-	@import '../../common/uni-uvue.css';
-</style>
\ No newline at end of file
+@import '../../common/uni-uvue.css';
+</style>