Vue.js一直是前端開發界的熱門框架之一，其簡化了前端開發流程。今天我們來講一講100行Vue.js代碼的應用。

var app = new Vue({
el: '#app',
data: {
message: "Hello World!"
}
});

這里，我們創建了一個Vue實例，并將其掛載到id為“app”的DOM元素上。我們的數據包含了一個字符串類型的“message”變量，初始值為“Hello World!”。

<div id="app">
{{ message }}
</div>

這之后，我們可以使用{{message}}標簽輸出數據到我們的DOM元素之中。

var app = new Vue({
el: '#app',
data: {
message: "Hello World!"
},
methods: {
updateMessage: function () {
this.message = "Vue.js is Awesome!";
}
}
});

我們甚至可以為我們的數據定義一個更新函數。“updateMessage”是一個點擊事件處理函數，當用戶點擊該事件時，我們將信息更改為“Vue.js is Awesome!”。

<div id="app">
{{ message }}
<button v-on:click="updateMessage">Update Message</button>
</div>

在此處，我們將“updateMessage”函數與按鈕元素綁定，以便當用戶按下按鈕時，函數可以被調用。

這只是100行代碼的一小部分，Vue.js還有許多強大的功能，例如組件化，虛擬DOM等等。我希望這篇文章可以讓你更好的了解Vue.js，并能夠在你的項目中使用它。謝謝。