feat(v-if): 增加一个简单例子，包含子元素且有大小

pages/directive/v-if/v-if.test.js

@@ -43,4 +43,15 @@ describe('v-if', () => {
     const element_not_abc = await page.$('.text-not-a-b-c')
     expect(await element_not_abc.text()).toBe('Not A/B/C')
   })
+  it('remove-children', async () => {
+    const child_a = await page.$('.child-a')
+    expect(await child_a.text()).toBe('child-a')
+
+    const btn_view = await page.$('.btn-remove-chilren')
+    await btn_view.tap()
+    await page.waitFor(50)
+
+    const child_a2 = await page.$('.child-a')
+    expect(child_a2).toBe(null)
+  })
 })
\ No newline at end of file

pages/directive/v-if/v-if.uvue

@@ -18,6 +18,13 @@
       <text class="text-not-a-b-c">Not A/B/C</text>
     </view>
     <view class="btn-view view-click-abc" @click="switchABC">Switch A/B/C</view>
+
+    <view class="children">
+      <view v-if="showChildren">
+        <view class="child-a">child-a</view>
+      </view>
+    </view>
+    <view class="btn-view btn-remove-chilren" @click="removeChilren">removeChilren</view>
   </view>
 </template>
 
@@ -28,7 +35,8 @@
     data() {
       return {
         show: true,
-        type: 'A'
+        type: 'A',
+        showChildren: true
       }
     },
     methods: {
@@ -42,7 +50,17 @@
         }
 
         this.type = TypeList[typeIndex]
+      },
+      removeChilren() {
+        this.showChildren = false
       }
     }
   }
 </script>
+
+<style>
+  .child-a {
+    width: 100px;
+    height: 100px;
+  }
+</style>
\ No newline at end of file