我們現在來看一個簡單的 Vue 示例。在這個示例中，我們將渲染一個簡單的表單，然后計算用戶輸入的數字的平方。讓我們來看一看代碼實現：

<div id="app">
<input type="number" v-model="num">
<p>{{ squared }}</p>
</div>

在上面的代碼中，我們使用了 Vue 的 v-model 指令來綁定輸入框的值到 num 變量上。然后，我們使用雙大括號語法來渲染 squared 變量的值。

new Vue({
el: '#app',
data: {
num: 0,
},
computed: {
squared: function() {
return this.num * this.num;
}
}
});

接下來，我們需要實例化一個 Vue 對象，并將其綁定到 #app 元素上。然后，我們定義了一個 data 屬性，它包含一個 num 變量，它將與輸入框的值進行綁定。我們還定義了一個 computed 屬性，它將自動計算 squared 變量的值，并返回 num 變量的平方。

最后，我們需要添加一些樣式來美化我們的表單：

input[type="number"] {
padding: 10px;
font-size: 16px;
margin-bottom: 20px;
}
p {
font-size: 20px;
font-weight: bold;
}

這里我們僅僅添加了一些簡單的 CSS 樣式，使我們的表單看起來更美觀。現在，我們的 Vue 示例已經準備就緒！

總之，Vue 是一個非常強大且易于學習的 JavaScript 框架。在這個簡單的示例中，我們介紹了一些基本的 Vue 概念，包括 v-model 和 computed 屬性。我們還使用了一些簡單的 CSS 樣式，使我們的表單看起來更美觀。希望這個小實例能夠幫助您更好地學習 Vue，并開始構建自己的 Web 應用程序。