更新tabbar监听事件

src/packages/avatar/avatar.vue

@@ -32,13 +32,13 @@ export default {
     computed:{
         styles(){
             return {
-                'background':this.bgColor + ' url('+this.bgImage+')'+'no-repeat',
+                'background':`${this.bgColor} url(${this.bgImage}) no-repeat`,
                 'backgroundSize':'100%'
             }
         },
         iconStyles(){
             return {
-                'backgroundImage': 'url('+this.bgIcon+')'
+                'backgroundImage': `url(${this.bgIcon})`
             }
         }
     },

src/packages/avatar/demo.vue

@@ -24,14 +24,14 @@
     <h4>修改背景图片</h4>
     <div class="white-bg">
       <nut-avatar
-        bgIcon
-        bgImage="http://img30.360buyimg.com/uba/jfs/t1/84318/29/2102/10483/5d0704c1Eb767fa74/fc456b03fdd6cbab.png"
+        bg-icon
+        bg-image="http://img30.360buyimg.com/uba/jfs/t1/84318/29/2102/10483/5d0704c1Eb767fa74/fc456b03fdd6cbab.png"
       ></nut-avatar>
     </div>
     <h4>修改头像ICON图标</h4>
     <div class="white-bg">
       <nut-avatar
-        bgIcon="http://img10.360buyimg.com/uba/jfs/t1/69001/30/2126/550/5d06f947Effd02898/95f18e668670e598.png"
+        bg-icon="http://img10.360buyimg.com/uba/jfs/t1/69001/30/2126/550/5d06f947Effd02898/95f18e668670e598.png"
       ></nut-avatar>
     </div>
     <h4>点击头像有触发事件</h4>

src/packages/tab/demo.vue

@@ -3,16 +3,16 @@
     <!-- DEMO区域 -->
     <h4>默认用法</h4>
     <nut-tab @tab-switch="tabSwitch">
-        <nut-tab-panel tabTitle="页签1">页签1</nut-tab-panel>
-        <nut-tab-panel tabTitle="页签2">页签2</nut-tab-panel>
-        <nut-tab-panel tabTitle="页签3">页签3</nut-tab-panel>
+        <nut-tab-panel tab-title="页签1">页签1</nut-tab-panel>
+        <nut-tab-panel tab-title="页签2">页签2</nut-tab-panel>
+        <nut-tab-panel tab-title="页签3">页签3</nut-tab-panel>
     </nut-tab>
     <h4>支持导航条在上下左右位置</h4>
     <nut-tab @tab-switch="tabSwitch">
       <nut-tab-panel
         v-for="value in editableTabs"
         v-bind:key="value.tabTitle"
-        :tabTitle="value.tabTitle"
+        :tab-title="value.tabTitle"
         :iconUrl="value.iconUrl"
         v-html="value.content"
       ></nut-tab-panel>
@@ -21,7 +21,7 @@
       <nut-tab-panel
         v-for="value in editableTabs"
         v-bind:key="value.tabTitle"
-        :tabTitle="value.tabTitle"
+        :tab-title="value.tabTitle"
         :iconUrl="value.iconUrl"
         v-html="value.content"
       ></nut-tab-panel>
@@ -30,7 +30,7 @@
       <nut-tab-panel
         v-for="value in editableTabs"
         v-bind:key="value.tabTitle"
-        :tabTitle="value.tabTitle"
+        :tab-title="value.tabTitle"
         :iconUrl="value.iconUrl"
         v-html="value.content"
       ></nut-tab-panel>
@@ -39,7 +39,7 @@
       <nut-tab-panel
         v-for="value in editableTabs"
         v-bind:key="value.tabTitle"
-        :tabTitle="value.tabTitle"
+        :tab-title="value.tabTitle"
         :iconUrl="value.iconUrl"
         v-html="value.content"
       ></nut-tab-panel>
@@ -52,7 +52,7 @@
       <nut-tab-panel
         v-for="value in disableTabs"
         v-bind:key="value.tabTitle"
-        :tabTitle="value.tabTitle"
+        :tab-title="value.tabTitle"
         :disable="value.disable"
         v-html="value.content"
       ></nut-tab-panel>

src/packages/tab/tab.vue

@@ -9,7 +9,6 @@
                     v-on:click="switchTab(index,$event,value.disable)" class="nut-title-nav-list" 
                     :class="['nut-title-nav',{'nut-tab-disable':value.disable},{'nut-tab-active' : activeIndex == index}]"
                     >
-                    <b v-if='closable' class="close-btn" v-on:click="closeItem(value)">x</b>
                     <a :href="value.href" :clstag="value.clstag" class="nut-tab-link" v-on:click="switchTabLink(index,$event,value.disable)">
                     <i class="nut-tab-icon" :style="{backgroundImage: 'url('+value.iconUrl+')'}" v-if="value.iconUrl"></i>
                     {{value.tabTitle}}
@@ -28,7 +27,6 @@
                         v-on:click="switchTab(index,$event,value.disable)" class="nut-title-nav-leftnav" 
                         :class="['nut-title-nav',{'nut-tab-disable':value.disable},{'nut-tab-active' : activeIndex == index}]"
                         >
-                        <b v-if='closable' class="close-btn" v-on:click="closeItem(value)">x</b>
                         <a :href="value.href" :clstag="value.clstag" class="nut-tab-link" v-on:click="switchTabLink(index,$event,value.disable)">
                         <i class="nut-tab-icon" :style="{backgroundImage: 'url('+value.iconUrl+')'}" v-if="value.iconUrl"></i>
                         {{value.tabTitle}}
@@ -50,9 +48,7 @@
                         v-on:click="switchTab(index,$event,value.disable)" class="nut-title-nav-rightnav" 
                         :class="['nut-title-nav',{'nut-tab-disable':value.disable},{'nut-tab-active' : activeIndex == index}]"
                         >
-                        <b v-if='closable' class="close-btn" v-on:click="closeItem(value)">x</b>
                         <a :href="value.href" :clstag="value.clstag" class="nut-tab-link" v-on:click="switchTabLink(index,$event,value.disable)">
-                        
                         {{value.tabTitle}}
                         <i class="nut-tab-icon" :style="{backgroundImage: 'url('+value.iconUrl+')'}" v-if="value.iconUrl"></i>
                         </a>
@@ -70,7 +66,6 @@
                     v-on:click="switchTab(index,$event,value.disable)" class="nut-title-nav-list" 
                     :class="['nut-title-nav',{'nut-tab-disable':value.disable},{'nut-tab-active' : activeIndex == index}]"
                     >
-                    <b v-if='closable' class="close-btn" v-on:click="closeItem(value)">x</b>
                     <a :href="value.href" :clstag="value.clstag" class="nut-tab-link" v-on:click="switchTabLink(index,$event,value.disable)">
                     <i class="nut-tab-icon" :style="{backgroundImage: 'url('+value.iconUrl+')'}" v-if="value.iconUrl"></i>
                     {{value.tabTitle}}
@@ -159,18 +154,6 @@ export default {
                 this.initTab(slot);  
             },100);  
         },
-        closeItem:function(value){
-            this.$emit('tab-remove',value); 
-            setTimeout(()=>{
-                this.tabTitleList=[];
-                if(this.$slots.default){
-                    let slot = [...this.$slots.default];
-                    this.initTab(slot);
-                }else{
-                    this.showTabs = false;
-                }
-            },10);
-        },
         initTab:function(params){
             let slot = params;
             for(let i = 0; i < slot.length; i++) {
@@ -178,7 +161,7 @@ export default {
                 if(typeof(aa)=='string'){
                     if(slot[i].tag.indexOf('nut-tab-panel') != -1) {
                         let item ={
-                        'tabTitle':slot[i].data.attrs.tabTitle,
+                        'tabTitle':slot[i].data.attrs['tab-title'] || slot[i].data.attrs['tabTitle'],
                         'disable':slot[i].data.attrs.disable==''?true:false,
                         'iconUrl':slot[i].data.attrs.iconUrl,
                         'clstag': slot[i].data.attrs.clstag,

src/packages/tabbar/tabbar.vue

@@ -43,6 +43,14 @@ export default {
           tabList:this.tabbarList
         };
     },
+    watch:{
+       tabbarList:{
+           handler(value){
+            this.tabList = value;
+           },
+           deep:true
+       }
+    },
     computed:{
         
     },