vue 如何根据条件判断属性的添加和去除

:loading = isLoading

isLoading:false/true

this.isLoading = true
this.isLoading = false

<div id="app">
    <input type="button" value='toggle' @click='flag=!flag'>
    <h3 v-if='flag'>v-if directive</h3>
</div>

var vm = new Vue({
    el:'#app',
    data:{
       flag:true
    },
    methods:{}
});

<div id="app">
    <h3 v-if='flag'>Yes</h3>    
    <h3 v-else='flag'>No</h3>
</div>

var vm = new Vue({
    el:'#app',
    data:{
       flag:true
    },
    methods:{}
});

<div id="app">
    <h3 v-if='star==="Jackson"'>Jackson</h3>    
    <h3 v-else-if='star==="Lay"'>Lay</h3>    
    <h3 v-else='star==="Yang"'>Yang</h3>
</div>

var vm = new Vue({
    el:'#app',
    data:{
       star:Jackson
    },
    methods:{}
});

    <div id="app">
        <input type="button" value='toggle' @click='toggle'>
        <!-- 一般来说，v-if 有更高的切换消耗，而 v-show 有更高的初始渲染消耗。
        因此，如果需要频繁切换：用 v-show 较好；如果在运行时条件不大可能改变：
        用 v-if 较好 -->
        <h3 v-if='flag'>v-if directive</h3>
        <h3 v-show='flag'>v-show directive</h3>
    </div>

<script>
    var vm = new Vue({
        el:'#app',
        data:{
            flag:true
        },
        methods:{
            toggle(){
                this.flag =! this.flag;
            }
        }
    });
</script>