Obsidian-Main/05. 資料收集/Programming/vue.js.md

輸出

{{message}}

迴圈

v-for

<li v-for="item in list">{{ item }}</li>

輸入雙向綁定：v-model

<input v-model="message">

var app = Vue.createApp({
    data: function() {
        return {
            message: "要被綁定的訊息"
        }
    }
});

事件：v-on

<button v-on:click="testEvent">按我</button>

var app = Vue.createApp({
    method: {
        testEvent: function() {
            alert("你按了button");
        }
    }
});

條件式：v-if

<div v-if="isShow"></div>

var app = Vue.createApp({
    data: function() {
        return {
            message: "要被綁定的訊息",
            isShow: true
        }
    }
});

屬性綁定

v-bind