本文將會討論如何使用Vue 2.0來編寫一個電商網站。

首先，我們需要安裝Vue。

<script src="https://cdn.jsdelivr.net/npm/vue@2.6.14/dist/vue.js"></script>

接下來，我們需要構建一個Vue實例，該實例將會對整個網頁進行數據綁定。

var vm = new Vue({
el: '#app',
data: {
cartItems: [],
products: [
{
id: 1,
name: 'product1',
price: 100
},
{
id: 2,
name: 'product2',
price: 200
}
]
}
})

這段代碼中，我們將Vue實例掛載在id為app的HTML元素上。數據綁定的主要內容是購物車中的商品列表和商品列表。我們展開這些數據的方法：

<div id="app">
<div v-for="product in products">
{{ product.name }} - ${{ product.price }}
<button v-on:click="addToCart(product)">Add to Cart</button>
</div>
<ul>
<li v-for="item in cartItems">
{{ item.name }} - ${{ item.price }}
<button v-on:click="removeFromCart(item)">Remove from Cart</button>
</li>
</ul>
</div>

在這個例子中，我們使用v-for指令循環遍歷商品數組。每個商品都被展示出來，它的名稱、價格和添加到購物車的按鈕。v-on指令用于處理用戶的點擊事件，當用戶點擊添加到購物車按鈕時，函數addToCart會被調用。函數addToCart將商品信息添加到cartItems數組中，同時更新購物車展示，v-for指令重新渲染整個購物車列表。

最后，我們需要實現addToCart和removeFromCart函數：

var vm = new Vue({
...
methods: {
addToCart: function(product) {
this.cartItems.push({
id: product.id,
name: product.name,
price: product.price
});
},
removeFromCart: function(item) {
var index = this.cartItems.indexOf(item);
if (index !== -1) {
this.cartItems.splice(index, 1);
}
}
}
})

這些函數分別將商品添加到購物車和從購物車中刪除商品。addToCart函數接收一個商品對象作為參數，使用push()方法將商品添加到購物車中。removeFromCart函數接收一個購物車商品對象作為參數，使用indexOf()函數查找與購物車商品對象相同的商品在cartItems數組中的下標，并使用splice()方法將其從數組中刪除。

以上是使用Vue 2.0來編寫一個電商網站的基本實現方法。通過數據綁定和指令的使用，我們可以實現從商品列表到購物車的完整流程。此外，Vue還提供了很多其他功能，例如計算屬性、組件、路由等等，可以讓我們更加方便地開發復雜的應用程序。