vue2.0 之条件渲染

<template>
  <div>
    <a v-if="isPartA">partA</a>
    <a v-show="!isPartA">partB</a>
    <button v-on:click="toggle">toggle</button>
  </div>
</template>

<script>
  export default {
    data () {
      return {
        isPartA: true
      }
    },
    methods: {
      toggle () {
        this.isPartA = !this.isPartA
      }
    }
  }
</script>

<style>
  html {
    height: 100%;
  }
</style>

<template>
  <div>
    <a v-if="isPartA">partA</a>
    <a v-else>no data</a>
    <button v-on:click="toggle">toggle</button>
  </div>
</template>

<script>
  export default {
    data () {
      return {
        isPartA: true
      }
    },
    methods: {
      toggle () {
        this.isPartA = !this.isPartA
      }
    }
  }
</script>

<style>
  html {
    height: 100%;
  }
</style>