<div id="app">
<button v-on:click="toggleBtn">ボタンをクリック！</button>
<p v-bind:class="{view:view}">コンテンツ内容</p>
</div>*{
text-align:center;
}
p {
display: none;
}
p.view {
display: block;
} new Vue({
el: "#app",
data: function () {
return {
view: false,
};
},
methods: {
toggleBtn: function () {
this.view = !this.view;
},
},
});
External CSS
This Pen doesn't use any external CSS resources.