微信小程序 自定义三列城市弹窗
1.WXML
<picker mode="multiSelector" bindchange="bindMultiPickerChange" bindcolumnchange="bindMultiPickerColumnChange" value="{{multiIndex}}" range="{{multiArray}}">
<view class="picker">
{{multiArray[0][multiIndex[0]]}}{{multiArray[1][multiIndex[1]]}}{{multiArray[2][multiIndex[2]]}}
</view>
</picker>
2.JS
//res.data.data.arrayList是后台获得的数据,
数据传来的格式是见图

Page({
data: {
multiIndex: [0, 0, 0],
multiArray: [[],[],[]],
},
onShow(){
res.data.data.arrayList.forEach(function (v,i) {
v.shopList.forEach(function (j, d) {
j.shopList.forEach(function (t, p) {
that.data.shopId = ret.data
if (t.sysUserId == ret.data) {
that.data.multiIndex[0] = i
that.data.multiArray[1] = []
that.data.multiArray[2] = []
that.setData({
multiIndex: that.data.multiIndex,
multiArray: that.data.multiArray
})
res.data.data.arrayList[that.data.multiIndex[0]].shopList.forEach(function (g, t) {
that.data.multiArray[1].push(g.cityName)
if (d == t) {
j.shopList.forEach(function (l) {
that.data.multiArray[2].push(l.districtName)
})
}
})
that.data.multiIndex[2] = p
that.data.multiIndex[1] = d
that.setData({
multiIndex: that.data.multiIndex,
multiArray: that.data.multiArray
})
}
})
})
})
}
微信小程序 自定义三列城市弹窗的更多相关文章
- 微信小程序自定义弹窗wcPop插件|仿微信弹窗样式
微信小程序自定义组件弹窗wcPop|小程序消息提示框|toast自定义模板弹窗 平时在开发小程序的时候,弹窗应用场景还是蛮广泛的,但是微信官方提供的弹窗比较有局限性,不能自定义修改.这个时候首先想到的 ...
- 微信小程序自定义 tabbar
一定的需求情况下,无法使用小程序原生的 tabbar 的时候,需要自行实现一个和 tabbar 功能一模一样的自制组件. 查阅了海量的博客和文档之后,亲自踩坑.总结了三种在不使用微信小程序原生 tab ...
- 微信小程序-自定义底部导航
代码地址如下:http://www.demodashi.com/demo/14258.html 一.前期准备工作 软件环境:微信开发者工具 官方下载地址:https://mp.weixin.qq.co ...
- 微信小程序——自定义导航栏
微信头部导航栏可能通过json配置: 但是有时候我们项目需求可能需要自定义头部导航栏,如下图所示: 现在具体说一下实现步骤及方法: 步骤: 1.在 app.json 里面把 "navigat ...
- 微信小程序把玩(三)tabBar底部导航
原文:微信小程序把玩(三)tabBar底部导航 tabBar相对而言用的还是比较多的,但是用起来并没有难,在app.json中配置下tabBar即可,注意tabBar至少需要两个最多五个Item选项 ...
- 微信小程序自定义tabbar的实现
微信小程序自定义tabbar的实现 目的:当采用微信的自定义tabbar组件的时候,切换的时候会出现闪屏的效果:当使用微信默认的tabbar的时候,限制了tabbar的数量以及灵活配置. 方案:自己动 ...
- 微信小程序 自定义导航组件 nav头部 全面屏设计
nav-dynamic 微信小程序自定义nav头部组件:适配全面屏设计: 实现功能 初始进入页面时,展示初始状态下的nav样式: 页面滚动时,监听页面滚动事件,展示滚动状态下的nav样式: 根据配置字 ...
- 微信小程序自定义组件,提示组件
微信小程序自定义组件,这里列举了一个常用的提示自定义组件,调用自定义组件中的方法和字段.仅供参考和学习. 编写组件: 在根目录下添加“components”目录,然后像添加Page页面一样添加自定义组 ...
- 微信小程序自定义Tabber,附详细源码
目录 1,前言 2,说明 3,核心代码 1,前言 分享一个完整的微信小程序自定义Tabber,tabber按钮可以设置为跳转页面,也可以设置为功能按钮.懒得看文字的可以直接去底部,博主分享了小程序代码 ...
随机推荐
- Web开发——HTML基础(HTML响应式Web设计 Bootstrap)
参考: 参考:http://www.bootcss.com/ 目录: 1.什么是响应式 Web 设计? 2.创建自己的响应设计 3.使用 Bootstrap 1.什么是响应式 Web 设计? RWD ...
- REST风格的5条关键原则
REST风格的5条关键原则包括: (1)网络上的所有事物都被抽象为资源. (2)每个资源对应一个唯一的资源标识. (3)通过通用的连接件接口对资源进行操作. (4)对资源的各种操作不会改变资源标识. ...
- python编写shell脚本详细讲解
python编写shell脚本详细讲解 那,python可以做shell脚本吗? 首先介绍一个函数: os.system(command) 这个函数可以调用shell运行命令行command并且返回它 ...
- java之jdbc使用
简单使用 Statement 通过 Statement 执行 ,其实是拼接 sql 语句的. 先拼接 sql 语句,然后在一起执行. package com.zze.test; import jav ...
- python之requests模块快速上手
安装 pip3 install requests 使用 发送请求 import requests r = requests.get('http://www.baidu.com') 还可以如下方式发送不 ...
- C++中的对象初始化
当对象在创建时获得了一个特定的值,我们说这个对象被初始化.初始化不是赋值,初始化的含义是创建变量赋予其一个初始值,而赋值的含义是把当前值擦除,而以一个新值来替代.对象初始化可以分为默认初始化.直接初始 ...
- Go 初体验 - 令人惊叹的语法 - defer.1 - 基本概念和用法
在我们编程时,难免遇见 流.远程连接.文件等 io 操作,为了高性能,我们不得不打开和关系这些 io 对象. 在 java.C# 语言里这些打开和关闭的操作都需要程序员自己选择操作时机,一般是在 io ...
- supervisor 守护进程
一.supervisor 安装 1.yum -y install epel-release 2.yum -y install supervisor 二.supervisor 配置文件详解 三.supe ...
- K均值
K-means算法的工作流程 首先,随机确定k个初始点的质心:然后将数据集中的每一个点分配到一个簇中,即为每一个点找到距其最近的质心,并将其分配给该质心所对应的簇:该步完成后,每一个簇的质心更新为该簇 ...
- php在cli模式下取得命令行中的参数的方法-getopt命令行可传递数组-简单自定义方法取命令行参数
在cli模式下执行PHP时,自动给脚本文件传递了一个变量$argv,其值即是一个命令中所有值组成的数组(以空格区分),在PHP程序中接收参数有3种方法1.直接使用argv变量数组. 2.使用$_SER ...