摘要:说明最近微信小程序也是挺火的了,看了微信官方文档语法和有点相似,正好学过也用写过一个商城项目,就尝试用小程序写个商城,一般来说你学过写个小程序那是很简单的,小程序和无非就是路由跳转传参传数据如果你想学可以来看看我用写的一个商城项目地址在这里
说明
最近微信小程序也是挺火的了,看了微信官方文档语法和vue.js有点相似,正好学过vue 也用vue写过一个商城项目,就尝试用小程序写个商城,一般来说你学过vue.js写个小程序那是很简单的,小程序和vue.js无非就是路由跳转、传参、传数据.
如果你想学vue.js可以来看看我用vue.js写的一个商城项目 地址在这里
运行需要安装微信开发者工具,在开发者工具中打开该项目则可预览 下载地址
另外:此程序会持续更新 如果觉可以欢迎各位satr fork Dome地址在这里 谢谢大家了~~~
Page({ /* 页面的初始数据 */ data: { UserImage: "", Username: "", }, /* 生命周期函数--监听页面加载 */ onLoad: function (options) { var _this=this wx.getUserInfo({ success:function(res){ _this.setData({ UserImage: res.userInfo.avatarUrl, Username: res.userInfo.nickName }) } }) }, about:function(){ wx.navigateTo({ url: "../../pages/about/about" , }) } })加入购物车
var json = require("../../data/Home_data.js") Page({ data:{ HomeIndex:0 }, goPay:function(e){ var Id = e.currentTarget.dataset.id wx.navigateTo({ url: "../../pages/pay/pay?id=" + Id }) }, boxtwo: function (e) { var index = parseInt(e.currentTarget.dataset.index) this.setData({ HomeIndex: index }) }, addcart: function (e) { var cartItems = wx.getStorageSync("cartItems") || [] var exist = cartItems.find(function (el) { return el.id == e.target.dataset.id }) //如果购物车里面有该商品那么他的数量每次加一 if (exist){ exist.value = parseInt(exist.value) + 1 }else{ cartItems.push({ id: e.target.dataset.id, title:e.target.dataset.title, image: e.target.dataset.image, price: e.target.dataset.price, value:1, selected:true }) } wx.showToast({ title: "加入购物车成功!", duration: 1000 }) //更新缓存数据 wx.setStorageSync("cartItems", cartItems) }, onLoad: function (option){ var homeid = option.id var Homedata = json.homeIndex[homeid]; this.setData({ data: Homedata }) } })购物车功能
var json = require("../../data/Home_data.js") Page({ data: { cartItems:[], total:0, CheckAll:true }, onLoad:function(e){ }, onShow: function () { var cartItems = wx.getStorageSync("cartItems") this.setData({ cartList: false, cartItems: cartItems }) this.getsumTotal() }, //选择 select:function(e){ var CheckAll = this.data.CheckAll; CheckAll = !CheckAll var cartItems = this.data.cartItems for(var i=0;i
文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。
转载请注明本文地址:https://www.ucloud.cn/yun/92187.html
摘要:全家桶还有就是组件库开头在线预览旧的版本移动端商城新的版本移动端商城项目演示地址移动端商城建议调试手机模式下预览因为刚买的域名主机所以要解析,实名认证才可以浏览,所以你们还是下把项目给下载下来本地运行看把 vue全家桶 vue2.0+vuex+axios+better-scroll还有就是miut-ui组件库 开头 在线预览 旧的版本:vivo移动端商城新的版本:vivo移动端商城项目...
摘要:非官方版微信小程序商城,基于版本接口,兼容原有程序,没有对原有程序代码进行过任何改动。 eweapp ECShop非官方版微信小程序商城,基于3.6版本appserver接口,100%兼容原有程序,没有对原有程序代码进行过任何改动。 GitHub https://github.com/tumobi/eweapp 功能列表 首页: 轮播图、商城滚动公告、精品推荐、新品上市、销量排行 分...
阅读 2928·2021-11-23 09:51
阅读 3748·2021-11-22 15:29
阅读 3210·2021-10-08 10:05
阅读 1533·2021-09-22 15:20
阅读 921·2019-08-30 15:56
阅读 1029·2019-08-30 15:54
阅读 714·2019-08-26 11:54
阅读 2617·2019-08-26 11:32