源碼 ASP源碼 PHP源碼 NET源碼 JSP源碼 FLASH源碼 其它源碼

微信商城小程序WeiMall

其它源碼 HTML我幫您 1年前  次瀏覽

針對小程序特性,提供了商城跟PHP后臺進行交互的解決方案,幫助用戶高效完成小程序開發,項目持續更新中...。

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

項目說明:

微信小程序:實現一個移動端小商城,項目持續更新中...

使用技術:Weui.wxssES6

目錄結構:

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的傳承和新的傳奇。由WeiMall開發團隊完成開發。如果您愿意支持我們的工作,歡迎您對DiyGw進行捐贈。

支付寶捐贈(收款人:[email protected]

微信小程序商城解決方案

微信捐贈(收款人:html580網站-鄧志鋒付錢)

微信小程序商城解決方案

如果您對WeiMall有任何建議、想法、評論或發現了bug,請聯系我們[email protected]

相關鏈接

發表評論

经典黑杰克游戏