电商商城小程序项目完整源码(微信小程序)

简介: 电商商城小程序项目完整源码(微信小程序)

如果要较完整学习微信小程序云开发可以看看这个“云+公开课”帮你了解完整的微信云托管部署流程,学习实战级的小程序开发。


1、首页

点击轮播图可以跳转详情页

点击专享礼包可以跳转

点击品牌或者商品可以跳转相应页面


10f607601b5441cb8ff2f6560fd32666.png794dec98629c4415ac596970c13e12bf.png



2、商品详情页

可以选择商品属性

可以添加购物车或者立即购买


60d0a7833b5c4347aaba211b24941291.pngeacfdb49898c496dacbaf979d406fbd4.png



3、购物车及结算页


194df8d764a0475ea4a02ca480c29cdd.png28b578c932af4c9e957391252c82c1e7.png



4、分类页面


fa68c4f013744d7abe4ba7066b950c54.png


5、新增地址


d6f0a0bf8e38448a9c70af7ee35c6f63.jpeg54a42c26cbc04efa9bfd2275c18926bf.jpeg


6、我的个人页


55729e7ce46b4f4e95dcfdb2e37584d4.jpeg


7、查看订单


b7d5140fec834a968c16ae0cda0c343d.png


8、优惠券


5b978bfef7d64a398e511e03fe7c6f57.png


9、意见建议

a83a8f6000434fada4a7f51f34e7b9cf.png


{
  "pages": [
    "pages/dashboard/index",
    "pages/shop/index",
    "pages/center/index",
    "pages/order/index",
    "pages/cart/index",
    "pages/type/index",
    "pages/good/index",
    "pages/payorder/index",
    "pages/center/feedback/feedback",
    "pages/brand/brand",
    "pages/brandShop/brandShop",
    "pages/getCoupon/getCoupon",
    "pages/sale/sale"
  ],
  "window": {
    "navigationBarBackgroundColor": "#FAFAFA",
    "navigationBarTitleText": "简商城",
    "navigationBarTextStyle": "black",
    "backgroundTextStyle": "dark",
    "backgroundColor": "#f9f9f9"
  },
  "debug": true,
  "tabBar": {
    "color": "#a9b7b7",
    "selectedColor": "#d81e06",
    "borderStyle": "white",
    "list": [
      {
        "selectedIconPath": "images/index.png",
        "iconPath": "images/index1.png",
        "pagePath": "pages/dashboard/index",
        "text": "首页"
      },
      {
        "selectedIconPath": "images/type.png",
        "iconPath": "images/type1.png",
        "pagePath": "pages/type/index",
        "text": "分类"
      },
      {
        "selectedIconPath": "images/cart.png",
        "iconPath": "images/cart1.png",
        "pagePath": "pages/cart/index",
        "text": "购物车"
      },
      {
        "selectedIconPath": "images/center.png",
        "iconPath": "images/center1.png",
        "pagePath": "pages/center/index",
        "text": "我的"
      }
    ]
  },
  "sitemapLocation": "sitemap.json"
}


相关文章
|
2月前
|
存储 JSON 小程序
微信小程序入门之新建并认识小程序结构
微信小程序入门之新建并认识小程序结构
58 1
|
28天前
|
移动开发 小程序
仿青藤之恋社交交友软件系统源码 即时通讯 聊天 微信小程序 App H5三端通用
仿青藤之恋社交交友软件系统源码 即时通讯 聊天 微信小程序 App H5三端通用
55 3
|
2月前
|
移动开发 小程序 数据可视化
基于npm CLI脚手架的uniapp项目创建、运行与打包全攻略(微信小程序、H5、APP全覆盖)
基于npm CLI脚手架的uniapp项目创建、运行与打包全攻略(微信小程序、H5、APP全覆盖)
340 3
|
2月前
|
小程序 JavaScript API
微信小程序开发之:保存图片到手机,使用uni-app 开发小程序;还有微信原生保存图片到手机
这篇文章介绍了如何在uni-app和微信小程序中实现将图片保存到用户手机相册的功能。
963 0
微信小程序开发之:保存图片到手机,使用uni-app 开发小程序;还有微信原生保存图片到手机
|
2月前
|
XML 小程序 JavaScript
小程序入门之项目配置说明和数据绑定
小程序入门之项目配置说明和数据绑定
46 1
|
2月前
|
移动开发 小程序 数据可视化
一招学会DIY官网可视化设计支持导出微擎、UNIAPP、H5、微信小程序源码
一招学会DIY官网可视化设计支持导出微擎、UNIAPP、H5、微信小程序源码
51 2
|
2月前
|
小程序 数据可视化 API
低代码可视化-uniapp商城首页小程序-代码生成器
低代码可视化-uniapp商城首页小程序-代码生成器
33 0
|
2月前
|
缓存 开发框架 移动开发
uni-app:下载使用uni&创建项目&和小程序链接&数据缓存&小程序打包 (一)
uni-app 是一个跨平台的开发框架,它允许开发者使用 Vue.js 来构建应用程序,并能够同时发布到多个平台,如微信小程序、支付宝小程序、H5、App(通过DCloud的打包服务)等。uni-app 的目标是通过统一的代码库,简化多平台开发过程,提高开发效率。 在这一部分中,我们将逐步介绍如何下载和使用uni-app、创建一个新的项目、如何将项目链接到小程序,以及实现数据缓存的基本方法。
|
2月前
|
小程序 前端开发 数据可视化
微信商城小程序WeiMall
微信商城小程序WeiMall
38 0
|
2月前
|
JSON 小程序 JavaScript
uni-app开发微信小程序的报错[渲染层错误]排查及解决
uni-app开发微信小程序的报错[渲染层错误]排查及解决
682 7
下一篇
DataWorks