在线微信小程序可视化开发工具代码生成器:http://www.diygw.com

针对小程序特性,提供了商城跟PHP后台进行交互的解决方案,帮助用户高效完成小程序开发,项目持续更新中...。

源码地址:http://git.oschina.net/html580/weimall

项目说明:

微信小程序:实现一个移动端小商城,项目持续更新中...

使用技术:Weui.wxss 、 ES6

目录结构:

weimall/|-assets/|- images/|- plugins/|- styles/|- ...|-etc/|- config.js|- ...|-helpers/|- HttpResource.js|- HttpService.js|- ServiceBase.js|- Tools.js|- WxResource.js|- WxService.js|- WxValidate.js|- ...|-pages/|- start|- index.js|- index.json|- index.wxml|- index.wxss|- ...|-app.js|-app.json|-app.wxss|-...
  • assets — 存放静态文件,例如:images、styles、plugins
  • etc — 存放配置文件,例如:config.js
  • helpers — 存放帮助文件,例如:Promise 微信原生API、Promise wx.request、RESTful http client、Form validation
  • pages — 存放项目页面相关文件
  • app.js — 小程序逻辑
  • app.json — 小程序公共设置
  • app.wxss — 小程序公共样式表

增删改查

import ServiceBase from 'ServiceBase'class Service extends ServiceBase {constructor() {super()this.$$prefix = ''this.$$path = {wechatSignUp: '/index/wechatSignUp',wechatSignIn: '/index/wechatSignIn',decryptData: '/index/decryptData',signIn: '/index/signIn',signOut: '/index/signOut',data:'/index/data',detail: '/index/detail',add: '/index/add', del: '/index/del', update: '/index/update'}}wechatSignUp(params) {return this.postRequest(this.$$path.wechatSignUp, params)}wechatSignIn(params) {return this.postRequest(this.$$path.wechatSignIn, params)}wechatDecryptData(params) {return this.postRequest(this.$$path.decryptData, params)}signIn(params) {return this.postRequest(this.$$path.signIn, params) }signOut() {return this.postRequest(this.$$path.signOut) }//获取表格分页数据getData(params) {return this.getRequest(this.$$path.data, params)}//获取单条数据getDetail(params) {return this.getRequest(this.$$path.detail, params)}//新增数据addData(params){return this.postRequest(this.$$path.add, params)}//删除数据delData(params) {return this.getRequest(this.$$path.del, params)}//更新数据updateData(params) {return this.getRequest(this.$$path.update, params)}}export default Service//调用数据App.HttpService.getData({table:'banner',page:1}).then(data=>{if(data.code==0){data.data.forEach(n => n.path = App.renderImage(n.img));this.setData({images: data.data});}else{this.showModal(data.message);}});//新增数据App.HttpService.addData(params).then(data => {if (data.code == 0) {this.showToast(data.message)}}); //更新数据App.HttpService.updateData(params).then(data => {if (data.code == 0) {this.showToast(data.message);}});//删除数据App.WxService.showModal({title: '友情提示',content: '确定要删除这个地址吗?',}).then(data => {if (data.confirm == 1) {App.HttpService.delData({table: 'address',id: id}).then(() => App.WxService.navigateBack());}})

Form validation

 bindsubmit="submitForm">  class="weui-cells">  class="weui-cell weui-cell_input">  class="weui-cell__hd">  class="weui-label">姓名   class="weui-cell__bd">  name="name" value="{{ form.name }}" class="weui-input" type="text" placeholder="请输入姓名" />    class="weui-cell weui-cell_input">  class="weui-cell__hd">  class="weui-label">邮箱   class="weui-cell__bd">  name="email" value="{{ form.email }}" class="weui-input" type="text" placeholder="请输入邮箱" />     class="button-sp-area">  class="weui-btn" type="primary" formType="submit">确定   
import WxValidate from 'helpers/WxValidate' Page({ data: { form: { name : '', email: '', }, }, onLoad() { this.WxValidate = new WxValidate({ name: { required: true, minlength: 2, maxlength: 10, }, email: { required: true, email: true, }, }, { name: { required: '请输入姓名', }, email: { required: '请输入邮箱', email: '请输入有效的电子邮件地址', }, }) }, submitForm(e) { const params = e.detail.value if (!this.WxValidate.checkForm(e)) { const error = this.WxValidate.errorList console.log(error) return false } }, }) 

项目截图:

分享精神

非常感谢您的支持!如果您喜欢WeiMall,请将它介绍给自己的朋友,或者帮助他人安装一个DiyGw,又或者写一篇赞扬我们的文章。WeiMall是对ThinkPHP的传承和新的传奇。由GiyGw.com开发团队完成开发。

微信商城小程序WeiMall相关推荐

  1. 微信小程序云开发用户身份登录_云开发版的微信商城小程序第一章

    我们经过前面小程序基础和云开发基础的学习,今天就来带大家实现一个综合项目,上线一款属于自己的微信商城小程序. 文末有彩蛋 如果你有小程序基础可以跳过上面的基础,直接看下面的,如果没有小程序基础,建议你 ...

  2. c++如何让程序异常以后继续执行_微信商城小程序开发首页广告如何布局?c

    小程序的开发使得商家变现微信流量越来越便利,因此各类小程序制作数量不断增加,特别是不少商家选择制作商城类小程序.而在进行小程序制作的时候,是需要布局相应广告来进行流量转化的,那么微信商城小程序开发首页 ...

  3. 搭建一款开源的微信商城小程序:海风小店

    搭建一款开源的微信商城小程序:海风小店 准备工作 申请小程序账号 申请小程序账号只需要按照官网文档说明操作即可,这里我就不展开说了,地址:https://developers.weixin.qq.co ...

  4. 微信商城小程序开发方式有哪些?

    微信商城小程序开发系统的搭建方式包括独立自主研发.定制开发以及采购成品软件开发等方式,企业可以根据自身实际需求来选择适合自己的搭建方式. 一.独立自主研发 自主研发的商城小程序优势在于功能可以灵活控制 ...

  5. 开源微信商城小程序源码和商城小程序开发

    近年来,越来越多的人选择在移动端购物,这使得移动端购物系统的功能需求和性能复杂度越来越高.传统的购物APP不足以应对购物系统的频繁变化.因此,迫切需要一种灵活.高效.快捷的移动购物系统.开源微信商城小 ...

  6. 微信商城小程序(服装鞋子商场)的设计与实现(Vue.js+小程序+.NET Core )

    目录 第1章 概述 1 1.1 项目背景介绍 1 1.2 微信小程序概述 1 1.2.1 微信小程序发展状况 2 1.2.2 微信小程序丰富的API接口 2 第2章 相关技术概述 3 2.1 .NET ...

  7. H5电商营销系统+微信商城小程序、拼团、砍价、秒杀、优惠券、积分、分销等功能thinkphp二次开发

    H5电商营销系统+微信商城小程序.拼团.砍价.秒杀.优惠券.积分.分销等功能thinkphp二次开发 喜欢的联系我,提供源代码 1.后台应用form-builder PHP快速生成现代化表单:     ...

  8. Thinkphp开发微信商城小程序源码拼团小程序源码带后台+前端小程序拼团源码仿拼多多

    码说明:Thinkphp开发微信商城小程序源码拼团小程序源码带后台+前端小程序拼团源码仿拼多多 其它说明: 基于小程序的拼团应用,用户可通过拼团,随时发起拼团活动并分享给好友 拼团是商品营销和售卖的一 ...

  9. 校园超市,百货超市小程序,手把手带你开发一款微信商城小程序,云开发+cms+数据库+js+css+微信小程序

    从今天开始带领大家实现一款云开发版的校园二手商城小程序 技术选型 1,前端 微信小程序原生框架 css JavaScript 2,管理后台 云开发Cms内容管理系统 web网页 3,数据后台 小程序云 ...

最新文章

  1. 【进阶1-3期】JavaScript深入之内存空间详细图解
  2. python2 dict 乱序_为什么我的python dict变得无序?
  3. 快速傅里叶变换python_FFT快速傅里叶变换的python实现过程解析
  4. TCP客户端服务器(Python)
  5. ipc java_java – Thrift有IPC传输实现吗?或低延迟SOA解决方案
  6. 五子棋人机对战_10.带人机对战的五子棋程序
  7. Erlang中的record与宏
  8. 2014-04-08 创新点整理
  9. Java的OOP编程思想
  10. oracle清楚表空间碎片,ORACLE表空间的碎片整理
  11. 永磁同步电机矢量控制(一)——数学模型
  12. eclipse 启动失败,出现hs_err_pid972.log类文件,文件中含JavaThread Bundle File Closer daemon类内容
  13. 小米红米手机ROM制作工具,支持编辑修改,精简app,定制化修改,小白也可上手。
  14. html字体的样式与行高
  15. LinkedBlockingQueue 实现生产者消费者模型
  16. 基于Java毕业设计志愿者管理系统演示录像2020源码+系统+mysql+lw文档+部署软件
  17. GP规范--PUTKEY
  18. mysql数据库考试好考吗_MySQL数据库考试试题及答案
  19. IE9和JPEG-XR:第一印象
  20. 景观雕塑商城搭建应该注意些什么

热门文章

  1. 关于SVPWM马鞍形和相、线电压波形的一些汇总
  2. 笔记本电脑属于个人计算机吗,黄真真:笔记本电脑属于个人计算机的一种形式莫?...
  3. 终于有懂哥能把云计算、大数据和人工智能讲得明明白白了
  4. 软件测试工程师春招薪资20K+,BAT校招薪资表出炉!学弟学妹们看齐...
  5. 智学.com查成绩 html,智学.com查分数
  6. 微信内置浏览器屏蔽网页链接怎么办,微信跳转外部浏览器的实现教程
  7. 淘宝直通车的打法的方法与问题分析
  8. 《Adobe Illustrator CS5中文版经典教程》—第0课0.15节创建和编辑渐变
  9. 关于解决Photoshop CS5打开后出现已停止工作强制退出的问题
  10. [转]IDA + GDBServer实现iPhone程序远程调试