mint-ui Picker设置指定初始值
最近做的项目公司需求是信息输入页设置地址跳转下一页后,再返回信息输入页查看信息时,地址要默认显示前面选择的地址,以此记录下,需要小伙伴可以看看


data{return{}}中设置 :slots

在mounted中设置this.$nextTick(将回调延迟到下次 DOM 更新循环之后执行。在修改数据之后立即使用它,然后等待 DOM 更新。),然后从session中拿到前面选择的地址,
拿到省,Object.keys()会返回一个数组,当前省的数组,通过for循环找到这个省的序号,然后通过that.myAddressSlots[2].defaultIndex = i;即可设置之前选择的省

然后地址值改变就会触发绑定的change事件,change 事件有两个参数,分别为当前 picker 的 vue 实例和各 slot 被选中的值组成的数组values,然后通过在 change 事件中,可以使用注册到 picker 实例上的一些方法(文档有说明):
- setSlotValues(index, values):设定给定 slot 的备选值数组
values[0]为省,
values[1]为市
values[2]为区
通过setSlotValues设置市级备选值数组和区级备选值数组,picker.setSlotValues(1,Object.keys(myaddress[values[0]]));picker.setSlotValues(2,myaddress[values[0]][values[1]]);
- setSlotValue(index, value):设定给定 slot 被选中的值,该值必须存在于该 slot 的备选值数组中
通过setSlotValue设置指定的市/区值,picker.setSlotValue(1,that.myAddressCity);picker.setSlotValue(2,that.myAddresscounty);即之前选择的市/区,这里其实也可以继续用defaultIndex来设置的,只是要for循环拿到市/区在备选值数组中的序号
that.myAddressSlots[2].defaultIndex = i;

总结下就是可以通过传入 :slots="myAddressSlots",myAddressSlots的values传入备选值数组或者通过setSlotValues设置备选值数组,然后通过defaultIndex来设置指定值或者通过setSlotValue(index, value)来设置指定值。
网上也有很多方法可以参考:http://www.cnblogs.com/zpxm/p/8670960.html https://blog.csdn.net/SnowBeatRain/article/details/84646681
如此就可以去用好这组件了,当然看源码市了解最透彻的,如果有时间的话。
mint-ui Picker设置指定初始值的更多相关文章
- 编写高质量代码改善C#程序的157个建议[为泛型指定初始值、使用委托声明、使用Lambda替代方法和匿名方法]
前言 泛型并不是C#语言一开始就带有的特性,而是在FCL2.0之后实现的新功能.基于泛型,我们得以将类型参数化,以便更大范围地进行代码复用.同时,它减少了泛型类及泛型方法中的转型,确保了类型安全.委托 ...
- 编写高质量代码改善C#程序的157个建议——建议35:使用default为泛型类型变量指定初始值
建议35:使用default为泛型类型变量指定初始值 有些算法,比如泛型集合List<T>的Find算法,所查找的对象可能会是值类型,也有可能是引用类型.在这种算法内部,我们常常会为这些值 ...
- select2 javascript控件 如何设置指定的值
$("#id").select2("data") 这样的方法无效 要使用$("#selectNull").val("") ...
- Select2实现的带搜索的省市区三级联动代码 设置默认初始值
$(function() { $('#loc_province').select2('val','2456'); $('#loc_province').change(); $('#loc_city') ...
- 齐博x1给表单某个字段设置初始值
自定义表单虽然后台可以设置默认初始值,但是有时候想在前台动态设置初始值的话,可以在URL中添加该字段名,给他动态赋值即可.比如下面的price字段就是动态赋值的.
- PowerDesigner Mysql 主键自增、初始值、字符集
自增 在你所要设为自增型的键上(比如你的id)双击,弹出一个Column Properties对话框,右下角有一个Identify的选择框,选中它OK,就可以了. 再去查看Preview,就能看到AU ...
- java 基本数据类型初始值(默认值)
1.int类型定义的数组,初始化默认是0 2.String类型定义的数组,默认值是null 3.char类型定义的数组,默认值是0对应的字符 4.double类型定义的数组,默认值是0.0 5.flo ...
- C++类成员默认初始值
有时候我们会不给C++类成员变量赋初始值,或是因为忘记在构造函数中指定(C++11可以写在类内),或是觉得没有必要写.然而,因为觉得编译器会把变量赋成0而不写是错误的.本文通过C++标准来解释这个问题 ...
- keras embeding设置初始值的两种方式
随机初始化Embedding from keras.models import Sequential from keras.layers import Embedding import numpy a ...
随机推荐
- CQOI2019(十二省联考)游记
CQOI2019(十二省联考)游记 Day -? 自从联赛爆炸,\(THUWC\)爆炸,\(WC\)爆炸(就没有不爆炸的)之后我已经无所畏惧... 听说是考\(4.5 h\)吗? Day -1 \(Z ...
- python从开始到放弃想标题的day12
上次有说道函数的返回值,但是不是所有的数据类型都有返回值,一些常用的比如str基本都有返回值,list基本都没有返回值,dict基本都有返回值,还有就是函数和函数之间的数据是互不影响的,哪怕是一个函数 ...
- 第一课android开发之在activity间传递参数
一.活动间简单参数传递:1.在布局中添加按钮,用<Button,用id设置id名称,id="@+id/这儿填写你要设置成的名称":用text设置按钮上显示的文字.text=& ...
- Azure导出所有用户权限---powershell命令
直接运行脚本 #requires -Version 3.0 -Modules AzureRM.Resourcesparam( [switch] $GroupRolesB ...
- springmvc源码分析——入门看springmvc的加载过程
本文将分析springmvc是如何在容器启动的时候将各个模块加载完成容器的创建的. 我知道在web.xml文件中我们是这样配置springmvc的: 可以看到,springmvc的核心控制器就是Dis ...
- libgdx学习记录2——文字显示BitmapFont
libgdx对中文支持不是太好,主要通过Hireo和ttf字库两种方式实现.本文简单介绍最基本的bitmapfont的用法. 代码如下: package com.fxb.newtest; import ...
- 一、PHP概述 - PHP零基础快速入门
1) PHP 可以用来做什么? 我简单举几个例子: 网站建设: 微信公众号,微信小程序,小游戏的后端接口: 小工具类. 别着急,可能会觉得不知所云.简单来讲,PHP 可以编写计算机程序.程序的作用,简 ...
- NW.js使用及打包
简介 NW.js (原名 node-webkit)是一个结合了 Chromium 和 node.js 的应用运行时,通过它可以用 HTML 和 JavaScript 编写原生应用程序.它还允许开发者从 ...
- js判断iPhone XS、iPhone XS Max、iPhone XR
// iPhone X.iPhone XS && window.screen.width === && window.screen.height === ; // iP ...
- g.DrawImage图片合成在本机可以,在服务器一直报内存不够
g.DrawImage图片合成在本机可以,在服务器一直报内存不够,发现是这个要设为false