解决tabs组件的render方法可能会执行多次的问题。

lzcmaro · May 20, 2017 · 8b603e7 · 8b603e7
1 parent 2c30179
commit 8b603e7
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 4 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "v-mui",
-  "version": "1.0.0-beta2",
+  "version": "1.0.0-beta3",
   "description": "Mobile UI elements for Vue 2.0",
   "main": "dist/vue-mui.js",
   "scripts": {

diff --git a/src/components/tabs.vue b/src/components/tabs.vue
@@ -29,7 +29,9 @@ export default {
         // 遍历child，如果存在slot="content"的分发内容，且当前activeKey===item.eventKey的话，把它添加到data.tabContent中
         for (let item of child) {
           if (item.eventKey && this.activeKey === item.eventKey && item.$slots.content) {
-            this.tabContent = item.$slots.content
+            // $slots.content 得到的是一个VNode数组，直接赋值给tabContent的话，会导致render()执行多次
+            // 所以这里只取$slots.content的第一个VNode
+            this.tabContent = item.$slots.content.pop()
             return
           }
         }
@@ -42,8 +44,7 @@ export default {
     this.updateTabContent()
   },
   render(h) {
-    // TODO: 这里每次更新tabContent，都会render两次，未知原因，待解决
-    console.log('tabs.render')
+    console.log('tabs.render', this.$el)
     const props = {
       class: {
         'nav': true,