feat(TabBar): 新增 TabBar 导航栏组件

Author: juzi214032

.eslintrc

@@ -23,7 +23,8 @@
     "Component": true,
     "Page": true,
     "wx": true,
-    "App": true
+    "App": true,
+    "getCurrentPages":true
   },
   "ignorePatterns": [
     "dist/*",

commitlint.config.js

@@ -72,7 +72,7 @@ module.exports = {
         'CapsuleBar',
         'Circle',
         'ImageClipper',
-        'CustomTabBar'
+        'TabBar'
       ]
     ]
   }

examples/app.json

@@ -12,6 +12,7 @@
     "navigationBarTextStyle": "black"
   },
   "tabBar": {
+    "custom":true,
     "color": "#bbbbbb",
     "selectedColor": "#3963BC",
     "backgroundColor": "#ffffff",
@@ -85,7 +86,8 @@
         "pages/tabbar/index",
         "pages/combined-tabs/index",
         "pages/segment/index",
-        "pages/capsule-bar/index"
+        "pages/capsule-bar/index",
+        "pages/tab-bar/index"
       ]
     },
     {

examples/components/content-card/index.js

@@ -1,5 +1,8 @@
 // components/cotent-title/index.js
 Component({
+  options:{
+    multipleSlots:true
+  },
   externalClasses: ['l-content'],
   /**
    * 组件的属性列表

examples/components/content-card/index.wxml

@@ -1,7 +1,10 @@
 <view class="content-card">
   <view class="card-top">
-    <view class="card-dot"></view>
-    <view class="content-name">{{name}}</view>
+    <view class="card-top-left">
+      <view class="card-dot"></view>
+      <view class="content-name">{{name}}</view>
+    </view>
+    <slot name="top-right" />
   </view>
   <view class="card-bottom l-content {{cardPadding?'card-padding':'padd'}}">
     <slot />

examples/components/content-card/index.wxss

@@ -16,12 +16,20 @@
   margin-left: 26rpx;
 }
 
+.card-top-left{
+  display: flex;
+  align-items: center;
+}
+
 .card-top {
   display: flex;
   flex-direction: row;
   align-items: center;
+  justify-content: space-between;
   width: 750rpx;
   height: 100rpx;
+  padding-right: 26rpx;
+  box-sizing: border-box;
 }
 
 .content-name {

examples/pages/about/index.js

@@ -1,4 +1,5 @@
 // pages/about/index.js
+import tabbar from '../tabbar';
 wx.cloud.init({
   env: 'env-9eb476'
 });
@@ -10,7 +11,8 @@ Page({
    * 页面的初始数据
    */
   data: {
-    version: '....'
+    version: '....',
+    list:tabbar
   },
 
   /**

examples/pages/about/index.json

@@ -1,3 +1,5 @@
 {
-  "usingComponents": {}
+  "usingComponents": {
+    "l-tab-bar": "/dist/tab-bar/index"
+  }
 }

examples/pages/about/index.wxml

@@ -1,4 +1,5 @@
-<!-- pages/about/index.wxml -->
+<l-tab-bar text-color="#bbbbbb" list="{{list}}" />
+
 <view class='container'>
   <view class='logo-container'>
     <image class='logo-img' src='cloud://env-9eb476.656e-env-9eb476-1258886794/images/other/logo.png'></image>