Vue 淘宝购物车

最新推荐文章于 2023-05-24 10:23:53 发布

喜欢编程的霏霏

最新推荐文章于 2023-05-24 10:23:53 发布

阅读量294

点赞数 1

文章标签： vue html

本文链接：https://blog.csdn.net/weixin_48247966/article/details/119253815

版权

这篇博客详细介绍了如何利用 Vue.js 框架来实现淘宝购物车的核心功能，包括商品数量的增减、商品删除以及总价计算，提供了一个完整的模板示例。

摘要由CSDN通过智能技术生成

可增加/减少商品数量、删除商品、价格结算。

模板

 var CartTitle = {
            props:['uname'],
            template:`
                <div class="title">{
  {uname}}的商品</div>
            `
        }
        var CartList = {
            props:['list'],
            template:`
            <div>
                <div :key='item.id' v-for='item in list' class="item">
                    <img :src="item.img" class="img">
                    <div class="name">{
  {item.name}}</div>
                    <div class="chamge">
                        <a href="" class="a" @click.prevent='sub(item.id)'>-</a>
                        <input type="text" class="num" :value='item.num' @blur=