关于 vant-area 组件 onchange 始终选择第一个的问题

最新推荐文章于 2023-10-27 15:48:27 发布
最新推荐文章于 2023-10-27 15:48:27 发布
阅读量243 收藏
点赞数
文章标签： 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_49692963/article/details/132881069
版权

问题: @change 拿到的value 始终是 索引为0 的对象 (选择完后自动滑动到第一个)

city_list , county_list 有时能渲染,有时不能渲染/完全不能渲染

原因: van-area 组件必须  子集必须包含父级的code 

例如  省级 110000:北京市  市: 112000:市区  县级:  112100:东城区

东城区的code的开头必须是北京市的 11 和 市区的112 才能 在这个下面显示 !

结论,如果你的code 不是子集包含父级前缀的用不了这个组件,换van-cascader

天青色！
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Vant-Aliapp：支付宝小程序版本Vant组件库
02-26
Vant Aliapp是移动端Vue组件库的支付宝小程序版本，两者基于相同的视觉规范，提供一致的API接口，助力开发者快速构建小程序应用。 Vant Aliapp通过小程序转换器基于转换得到，并进行了少量的兼容适配调整。 预览 ...
vue vant Area组件使用详解
10-15
在 Vue Vant 中，`Area` 组件是一个用于选择省市区的组件，常用于地址选择等场景。这篇教程将详细介绍如何使用 `Area` 组件。 首先，由于官方提供的 `Area` 示例数据可能不全，我们需要引入自定义的 `areaList.js` ...
Vant 4中的van-picker选择总是第一个的解决办法
Source
08-26 1274
他默认是渲染text,但是一般在我们使用中99%的数据渲染都不可能是text,这个时候就可以使用文档中的columns-field-names来自定义自定义 columns 结构中的字段，比如我们的数据里面现在是name为需要渲染的字段就可以这么写。但是这个时候就会发现一个问题，就是不管你怎么选择都是第一个选项，因为我也是个前端小白，找了蛮久都没找到解决办法，后来试了一下自定义value居然可以，所以就可以写成。为啥一开始不自定义value,因为我想获取的是选择的这个对象，不是这个对象里面的某个属性。
＜el-pagination＞初期化显示currentPage一直是1的问题
weixin_47372236的博客
01-15 1684
网上有相应的解决方案，点击这里 看了上面的文章发现一个问题就是el-pagination初期化的时候，是不显示的。所以说一下下面的解决方案。 <el-pagination @current-change="页码变更事件" layout="total, sizes, prev, pager, next, jumper" @size-change="页面条数变更事件" :page-sizes="[15, 30, 45]" :current-page.sync="currentPage" :page-siz
移动端vant 弹框中包含tab页，记第一个tab,不加载数据问题
weixin_55895406的博客
09-09 1490
vant tab
vue vant van-area实现地区联动省市区三级选择
总结前端开发中遇到的问题，分享前端知识
08-18 1922
van-area实现地区联动省市区三级选择
vant-tabbar默认选中失效问题
tianmeng.luo的博客
01-04 1771
vant-tabbar 默认选中项失效
vant-ui组件调用Dialog弹窗异步关闭操作
01-18
我就需要一个很简单的：点击操作弹窗显示后，我填写一个表单，表单校验通过后，再调用API接口，返回成功后，关闭弹窗。 一个很简单的东西，element-ui用的很方便，在这里就懵比了，刚开始做的，弹窗关闭了，才返回...
vant-ui框架的一个bug(解决切换后onload不触发)
01-22
1.用npm下载该模块包 npm i vant -S 2.引入组件 官方提供了三种方法。（我使用了第三种，全局引入方法） 方式一. 使用 babel-plugin-import (推荐) babel-plugin-import 是一款 babel 插件，它会在编译过程中将 ...
vant area 省市区列表数据数据源
03-05
vant官网中找不到关于area省市区选择的数据源，所以我这边整理成 json格式，以便下载使用。
vant form表单内部button触发提交解决办法
hy3528的博客
06-09 1607
/</</一开始我选择在事件中加上.stop来阻止，但发现并没有用。
VantUI_van-tabs_active属性使用无效踩坑记录
wsfufua的博客
08-29 1190
Vant Weapp 使用van-tabs时设置active无效的问题解决及应用
Vant-UI 表单组件（Field组件）：验证表单元素&&表单提交 - 踩坑篇
热门推荐
草巾冒小子的博客
03-01 8万+
Vant-UI 表单组件（Field组件）：验证表单元素&amp;amp;amp;&amp;amp;amp;表单提交：
关于vantUI的导航组件tab标签页在ios和安卓中运用遇到的坑
MAYA_G的博客
09-25 877
vantTab的初始化赋值不同方法在ios和安卓中的区别
vant 表单验证
蓝胖子的博客
04-20 8988
标签：van Vant form 验证 验证码 表单 message 一 、使用方法 表单校验 1.1 用 van-form 包住 1.2 在 van-field 上要有 v-model=“变量” 和 绑定rules属性 :rules=“rules变量” rules变量:[ { // 是否必填 required:true, message:错误信息, trigger:"onBlur/onChange"}, { // 自定义表单校验 validator: value =&
vue移动端项目vant组件库之cascader级联选择
笑望灬星辰
02-25 1万+
vue vant 级联选择 <template> <div> <van-field v-model="fieldValue" is-link readonly label="地区" placeholder="请选择所在地区" @click="show = true" /> <van-popup v-model="show" round position="bottom
Cascader 级联选择器如何设置默认值（数据回显）
weixin_44169663的博客
02-11 6794
Cascader 级联选择器如何设置默认值 在使用级联选择器时，如果要设置默认值，组件接受的数据类型是一个二位数组，当后端返回的结果只有最底层的数组时，就要去遍历整个级联选择器绑定的数据源，获取最外层到最内层数据的路径 页面效果： 级联选择器数据源（理论上无限层，本人项目中实际最多五六层）： 后端返回的默认勾选值： [19,7] 的意思是级联选择器数据源最后一层的id的集合，19是图一中的密钥对的id，7是应用栈的id 如果想要选择器勾选这两项，那么他需要的数据结构为 [[1,5,19],[1,7]]
VanCascader默认值（ 地址code转换）
最新发布
qq_61947503的博客
10-27 470
我在使用VanCascader的时候，发现页面刷新进入时组件没有默认值，提示的是placeholder“请输入地址”，但是我希望进去时显示我传入的值，如：“湖北省武汉市洪山区”，（code:110101),一般传入的是code值，故希望两者转化。代码说明：使用findOptionWithParents（）获取你传入的modelValue值（如：”110101“），获取你所需要得到的option选项（’东城区‘），根据option获取父级（’北京市‘），父级的父级（’北京市‘），再根据join()拼接。
vant插件使用area组件使用心得
MengLi的博客
10-31 9733
1.官方给出的方法中的value是设置默认值的，字符串设置成区的就ok 2.areaList是可以自定义的 <template> <div class='levelLinkage' v-show='chooseshow'> <div class='mask' @click="close">...
uniapp开发微信小程序需要使用vant-weapp组件库，hbuild编译器如何安装vant-weapp组件
07-27
要在HBuilderX中安装vant-weapp组件库，你可以按照以下步骤操作： 1. 打开HBuilderX，进入你的uni-app项目。 2. 在项目根目录下，找到 `manifest.json` 文件。 3. 在 `manifest.json` 文件中，找到 `"easycom"` ...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值