vant下拉菜单在app中的问题

最新推荐文章于 2024-03-20 00:20:30 发布
最新推荐文章于 2024-03-20 00:20:30 发布
阅读量3.4k 收藏 2
点赞数 2
文章标签： vue.js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/xiaoHelloWord/article/details/103801685
版权

在这里插入图片描述
这是从vant复制下来变的在这里插入图片描述
再这里只显示了一行，当我点击的时候这么显示在这里插入图片描述
这个时候只需要
在这里插入图片描述
这么写分为两个在这里插入图片描述
然后根据需求改下css样式

在这里插入图片描述
起个类名让下面的div分为两个
在这里插入图片描述
就能完成了。
后续根据点击不同的种类查询出排序
我们只需要用watch监听v-model的值
在这里插入图片描述
传入参数
在这里插入图片描述
值根据后台要求的去填写 原型是 字符串’a’的形式，我已经给替换掉整型了

真的不想哇
关注
  • 2
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
vant自定义二级菜单操作
01-18
（1）组件解释： 本组件是为了解决二级联动的效果编写的，这里使用了省份和城市分开的效果，具体展示效果，可以参考下面。 （2）组件代码： <template> <div> <button @click=showM>{{ value || 选择省份 }}</button> <button @click=showC>{{ value2 || 选择城市 }}</button> <!-- 省份 --> <van v-model=showPicker position=bottom> <van-picker show-toolbar :colum
vant --- DropdownMenu下拉菜单有白边问题
weixin_42365757的博客
12-30 771
解决代码： <style > .van-dropdown-menu__bar{ box-shadow: unset !important; /* 解决van-dropdownMenu下拉菜单有白边问题 */ } </style> 例子：
Vant （List组件）和下拉菜单（DropdownMenu）实现数据切换导致界面数据异常的解决办法以及问题所在。
最新发布
qq_59310224的博客
03-20 432
快速解决Vant LIst组件 和 下拉组件连用造成的数据异常问题！！
vant移动端下拉菜单最后几项滑动时选不上
weixin_44727080的博客
10-26 864
比如这样 后三项选不了 解决方法是：给末尾加三行空格： this.enterpriseList.push({}); 这样就可以选中啦 补充：开头加是这种 this.enterpriseList.unshift({});
uniapp van-dropdown-menu 下拉后页面无法点击的问题
weixin_46324536的博客
12-08 747
可以将 @vant/weapp/dropdown-item/index.wxml 里面的 van-popup 的事件改成驼峰写法 afterEnter 和 afterLeave 就可以了。是关于uniapp底层的问题。
关于小程序引用Vant中下拉菜单DropdownMenu的遮罩层Bug
qq_47608978的博客
07-25 3969
写在前面 做了一个原生小程序项目，设计图是将一个筛选放在了整个页面的中间，当然为了方便我选择了引用组件，查看了一下比较主流的小程序组件，发现Vant比较适合我的需求，于是就引用了Vant，怎么引用这里不做详细说明，接下来说一下遇到的问题，以及本人的新路历程和解决方法。 发现Bug 在引用Vant组件一直到看官方示例文档，期间都很顺利，实现效果也很满意，就当我以为这个问题即将结束的时候，新的问题出现了。下拉菜单放到中间位置，上方没有遮罩，这个时候滑动上方的部分，整个内容都会跟着滚动，然而我们引用的下拉菜
移动端使用Vant组件库时遇到的问题记录
m0_58575070的博客
10-23 200
如图所示，在使用导航栏组件时，下方会有白线。// 去掉导航栏底部白线。
解决Vant中的Tab标签页中使用 DropdownMenu下拉菜单的 bug
qq_44307861的博客
10-31 1629
ts+vant。
Vant组件NavBar导航栏使用时去除下方白线问题
qq_43188743的博客
10-26 2494
Vant组件导航栏使用中遇到的问题
Vant组件tabar解决页面刷新后，导航栏自动跳转至首页的问题
qq_45618033的博客
10-26 1073
【代码】Vant组件tabar解决页面刷新后，导航栏自动跳转至首页的问题。
关于html页面中头部navbar设置fixed绝对定位后，width 100% 会溢出覆盖滚动条
qq_44745931的博客
06-09 2378
关于html页面中头部navbar设置fixed绝对定位后，width 100% 会溢出覆盖滚动条 情况如下图： 头部覆盖住了滚动条 我遇到的情况分析： 前提： 头部和中间主体部分都在一个大的div元素下面，当头部采用fixed布局，中间主体部分没有采用定位且其高度超出父元素的高度时，会溢出导致滚动条的出现。 分析：此时滚动条是相对父元素出现的，不是相对于整个body的，而fixed定位是相对于整个浏览器窗体也就是body定位的，所以fixed定位的头部会压住滚动条。为了解决这个问题，就需要使滚动条是相对
在Vant的基础上封装下拉日期控件的代码示例
10-17
主要介绍了在Vant的基础上封装下拉日期控件的代码示例，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
Vue vant 上拉加载 下拉刷新实际案例源码模板
05-18
vant 上拉加载 下拉刷新实际案例源码模板。你可以用请求的数据放到模板里面可以直接使用，不需要改啥，只需要复制，粘贴 就 o j b k 了。
微信小程序中的上拉、下拉菜单功能
11-21
问题描述 在使用小程序的时候基本...在小程序中调用组件库，并在正确引用就可以实现了菜单功能了。 一、下拉菜单 (1)在 json 中调用 van-tab 组件。 "usingComponents": { "van-dropdown-menu": "/dist/dropdown-menu/
react实现移动端下拉菜单的示例代码
11-21
项目中要实现类似与vant的DropdownMenu:下拉菜单。看了vans 的效果 其实也没什么难度，于是动手鲁了一个这样的组件。 项目的技术栈为react全家桶+material UI + ant Design mobile。 vans的效果 我自己实现的效果 ...
软键盘的调起导致原来的界面被挤上去，或者导致界面下面的tab导航被挤上去
weixin_39178206的博客
04-16 352
解决方法： 使用Manifest中的Activity的android:windowSoftInputMode的"adjustPan"属性。 另外注意：有关软键盘的问题可参考android:windowSoftInputMode中属性
vant移动端遇到的一些问题记录
small_fox_dtt的博客
01-04 949
1. 使用动作面板ActionSheet 和弹出层Popup 被下层元素遮挡问题 解决方法 使用 get-container属性挂载到body上 2. 使用Tab 标签页组件 选中样式偏移 解决方法 给tab外层设置宽度100% 3. 使用transition动画切换路由 页面出现卡顿效果 解决方法 给外面路由设置宽度100% 4. 由于页面中书写beforeRouteLeave(to, from, next) { }方法 导致页面路由不跳转 5. 使用watch监听页面某一元素高度 来控制展
vue+vant移动端遇到的那些问题
热门推荐
weixin_41700532的博客
03-21 2万+
1、项目引用了lib-flexible 跟px2rem-loader做适配，然后真机测试的时候发现字体在手机上显示的很小。【推荐去看下px2rem-loader的文档】 原因+解决：百度说应该在后面加上/*px*/（font-size:14px;/*px*/），这里这么设置时，字体的大小要为两倍，如你想让字体显示为14px,css代码则为【font-size:28px;/*px*/】，对于bor...
vue实现上传图片添加水印
qq_45729353的博客
04-19 825
实现效果:可添加logo.(注:这里主要实现添加水印.图片上传用的vant的上传)将上传的file文件转成base64(代码如下)
vant下拉菜单使用
05-24
2. 在需要使用下拉菜单的页面中，引入 Vant 组件库和样式文件： ```javascript import Vue from 'vue'; import Vant from 'vant'; import 'vant/lib/index.css'; Vue.use(Vant); ``` 3. 在 HTML 中添加下拉菜单...

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值