vue.js实现购物车列表，对商品数量的加减，删除商品的功能

1. 首先，在Vue实例中定义一个数组来存储购物车中的商品列表，默认为空数组。

data: {
  cartItems: []
}

2. 在页面中使用v-for指令遍历购物车中的商品列表，并显示商品名称、价格、数量等信息。

<div v-for="item in cartItems" :key="item.id">
  <h3>{{ item.name }}</h3>
  <p>价格：{{ item.price }}</p>
  <p>数量：<input type="number" v-model="item.quantity"></p>
  <button @click="removeFromCart(item.id)">删除</button>
</div>

3. 实现商品数量的加减功能，可以通过给数量输入框绑定v-model指令，然后在Vue实例中定义一个方法来处理数量的增减操作。

methods: {
  addToCart(item) {
    item.quantity++;
  },
  removeFromCart(item) {
    if (item.quantity > 1) {
      item.quantity--;
    } else {
      this.cartItems.splice(this.cartItems.indexOf(item), 1);
    }
  }
}

4. 实现删除商品的功能，可以在页面中为每个商品添加一个删除按钮，并在Vue实例中定义一个方法来处理删除操作。

methods: {
  addToCart(item) {
    item.quantity++;
  },
  removeFromCart(item) {
    if (item.quantity > 1) {
      item.quantity--;
    } else {
      this.cartItems.splice(this.cartItems.indexOf(item), 1);
    }
  },
  removeItemFromCart(itemId) {
    this.cartItems = this.cartItems.filter(item => item.id !== itemId);
  }
}