Vue按钮绑定style控制标签显示或者隐藏

Html部分

<div id="test">
  <button type="button"  @click="makeActive">这是一个按钮</button>  //给按钮绑定一个点击事件
  <div class="text" v-bind:style="{display:actionHide}">这是一段文字</div>  //给按钮绑定一个v-bind，设置style属性，属性style值由按钮决定
</div>

JS部分

//确定一个方法名并挂载ID
var hide = new Vue({
  el:"#test",
data:{
    actionHide:"inline-block" //给予一个初始值
},
methods:{                         //设置一个方法
    makeActive:function(){    //创建一个函数
        if(this.actionHide=="inline-block"){  //判断当前actionHide的值从而分别设置值
            this.actionHide="none"
        }else{
            this.actionHide="inline-block"
        }
    }
}
})