微信小程序实用demo：省市县三级联动

柿霖不是林 · 发表于 2017-1-16 17:39:58

[mw_shl_code=html,true]var config = require('../../utils/config.js')
var mta = require('../../utils/mta_analysis.js')
var utils=require('../../utils/util')
var dataC; // 保存所有城市列表

var allCity; // 保存所有城市列表
var currentProvince; // 滚轮当前指向的省
var currentCity;
var currentArea;
var enterProvince; // 按下确定键后，保存到这里，用于发送请求
var enterCity;
var enterArea;

var remoteAvatar = ''; // 头像路径
var remoteVideo = '';
var remotePics = [];

Page({
data: {
      shopName: '',
      shopPhone: '',
      shopAddress: '',
      pics: [],
      showOrHide: 'show',
      locationStr:"请选择您的城市",
      shopIntroduce:"",
      nian:'',
      yue:'',
      ri:''
},
onLoad: function (options) {
      var that = this;
      var dataC=utils.getData();
      console.log(dataC.p[0]);
      currentProvince = dataC.p[0];
      console.log(currentProvince);
},
onReady: function () {
      mta.rptMain();
},
showCityPicker: function () {
      if (!currentProvince) {
         currentProvince = dataC.p[0];
         console.log(currentProvince);
         currentCity = dataC.c[currentProvince][0];
         currentArea = dataC.a[currentCity][0];
      }
      this.setData({
         showOrHide: 'show',
         provinces: dataC.p,
         citys: dataC.c[currentProvince],
         areas: dataC.a[currentCity]
      })
},
scrollProvince: function (e) {
      var dY = e.detail.scrollTop;
      var a = Math.round(dY / 20); // 移动的整位
      currentProvince = dataC.p[a]; // 选中的省
      currentCity = dataC.c[currentProvince][0] // 选中的城市
      currentArea = dataC.a[currentCity][0]; // 选中的区
      this.setData({
         citys: dataC.c[currentProvince],
         areas: dataC.a[currentCity]
      })
},
scrollCity: function (e) {
      var dY = e.detail.scrollTop;
      var a = Math.round(dY / 20); // 移动的整位
      currentCity = dataC.c[currentProvince][a] // 选中的城市
      currentArea = dataC.a[currentCity][0]; // 选中的区
      this.setData({
         areas: dataC.a[currentCity]
      })
},
scrollArea: function (e) {
      var dY = e.detail.scrollTop;
      var a = Math.round(dY / 20); // 移动的整位
      currentArea = dataC.a[currentCity][a]; // 选中的区
},
cancelPick: function () {
      this.setData({
         showOrHide: 'hide'
      })
},
enterPick: function () {
      enterProvince = currentProvince;
      enterCity = currentCity;
      enterArea = currentArea;
      this.setData({
         showOrHide: 'hide',
         locationStr: enterProvince + "  " + enterCity + "  " + enterArea
      })
},
formSubmit: function (e) {
      var that = this;
      // 检查所有参数是否完整
      if (!this.data.avatarSrc) {
         wx.showToast({
            title: '头像不能为空',
            duration: 2000
         })
      }
      if (!e.detail.value.shopName) {
         wx.showToast({
            title: '商铺名称不能为空',
            duration: 2000
         })
      }
      if (!e.detail.value.sellerPhone) {
         wx.showToast({
            title: '手机号不能为空',
            duration: 2000
         })
      }
      if (!this.data.locationStr || !e.detail.value.shopAddress) {
         wx.showToast({
            title: '商铺地址不能为空',
            duration: 2000
         })
      }
      if (!e.detail.value.introduction) {
         wx.showToast({
            title: '介绍不能为空',
            duration: 2000
         })
      }
      if (this.data.pics.length < 3) {
         wx.showToast({
            title: '繁育环境照片最少3张',
            duration: 2000
         })
      }
},
})[/mw_shl_code]

[mw_shl_code=applescript,true]var utils = require('../../utils/util');
const p = [];//省
const a = [];//市
const c = [];//区，县
var riqi;//日期
var val;//下标
Page({
data: {
      boxHide:"box-show",
      showBox:"hide-show"
},
onLoad: function (options) {
      var dataC = utils.getData();
      p.push(dataC.p);//province
      a.push(dataC.a);//area
      c.push(dataC.c);//city
},
bindChange: function (e) {
      val = e.detail.value;
      riqi = this.data;
      this.setData({
         months: c[0][riqi.years[val[0]]],
         days: a[0][riqi.months[val[1]]]
      })
},
yes: function () {//获取城市信息
      if (typeof (riqi) == "undefined") {
         this.setData({
            nian: "黑龙江省",
            yue: "大兴安岭地区",
            ri: "塔河县"
         })
      } else {
         this.setData({
            nian: this.data.years[val[0]],
            yue: this.data.months[val[1]],
            ri: this.data.days[val[2]]
         })
      }
},
cancelPick: function () {
      this.setData({
         boxHide:"box-show",
         showBox:"hide-show"
      })
},
enterPick: function () {
      console.log(c[0][p[0][0]][0]);
      this.setData({
         boxHide:"box-hide",
         showBox:"show-box",
         years: p[0],
         months: c[0][p[0][0]],
         days: a[0][c[0][p[0][0]][0]]
      })
},
enter: function () {
      if (typeof (riqi) == "undefined") {
         this.setData({
            nian: "黑龙江省",
            yue: "大兴安岭地区",
            ri: "塔河县"
         })
      } else {
         this.setData({
            nian: this.data.years[val[0]],
            yue: this.data.months[val[1]],
            ri: this.data.days[val[2]]
         })
      }
}
});[/mw_shl_code]

游客，如果您要查看本帖隐藏内容请回复

。。 · 发表于 2017-2-2 15:08:36

正需要，支持楼主大人了！

362101245 · 发表于 2018-1-17 17:01:13

正需要，支持楼主大人了！

306236532 · 发表于 2018-3-6 08:58:23

正需要，支持楼主大人了！

xiehuaxing · 发表于 2018-3-6 14:29:04

正需要，支持楼主大人了！

蜗牛0 · 发表于 2018-3-27 19:06:31

围观一下，哈哈哈

jerry369 · 发表于 2020-4-10 17:45:30

专注于与个人游戏开发者合作，有产品的朋友联系微信号jim20180688，详聊

		自动登录	找回密码
密码			立即注册

微信小程序实用demo：省市县三级联动

本帖子中包含更多资源