<tui-button type="white" width="100rpx" height="60rpx" shape="square" :link="true"@click="dropDownList(-1,1)"><text class="tui-button-text">全部</text><view class="tui-animation" :class="[dropdownShow&&type==1?'tui-animation-show':'']"><tui-icon name="turningdown" :size="20"></tui-icon></view></tui-button>

设置点击事件带入-1,来控制下拉框的打开,通过后面的索引值控制打开哪个页面

遇到的问题:旋转的小三角形单击另一个下拉框点击前一个下拉框无法复原

解决办法:给所有的下拉框赋予相同的:class="[dropdownShow&&type==1?'tui-animation-show':'']">通过相同的dropdownShow以及各自的索引值来控制下拉框小三角形的旋转状态

js部分:

 if (type == 1) {this.type = typeif (index !== -1) {this.tui.toast("index:" + index)}this.dropdownShow = !this.dropdownShow}

uniapp-ThorUi下拉框出现出现的问题相关推荐

  1. uniapp 自定义下拉框

    uniapp 自定义下拉框 根据 https://gitee.com/kcren/uniapp-dropdown-filter/tree/master 自己加了一层封装 可以进行切换选择下拉内容 模板 ...

  2. uni-app 开发小程序,使用到u-charts.js时会出现弹框或下拉框部分与图标重叠的情况(还有在解决过程中出现 vasToTempFilePath: fail canvas is empty)

    如下图,是我用uni-app开发小程序时出现视图与弹框或下拉框重叠的效果图,在微信开发工具上显示正常,但到了真机上就这样. 解决措施: 在小程序中canvas层级过高,导致z-index也无法让弹窗置 ...

  3. vue uniapp 微信小程序 搜索下拉框 模糊搜索

    vue uniapp 微信小程序 搜索下拉框 模糊搜索 话不多说 直接贴代码 template <template><view class="index"> ...

  4. uniapp下拉框组件

    之前写过一个小程序的,引入单个下拉框是没有问题的,但是一个页面引入多个下拉框组件的话就会有bug,比如可以同时展开多个下拉框的问题,在此修复了.如果大家有什么好的办法可以告诉我一下嘛~ 小程序选择框_ ...

  5. excel 表做下拉框_Excel工作表的组合框下拉列表

    excel 表做下拉框 Would you prefer a bigger font size for items in a data validation drop down list? Would ...

  6. uniapp-select 下拉框

    目前uniapp下拉框中比较友好的,功能比较完善 链接:superwei-combox 组合框 - DCloud 插件市场下拉搜索选择组合框,基于官方uni-combox组件,解决选择后再次选择不展示 ...

  7. 设置select下拉框不可修改的→“四”←种方法

    设置select下拉框为不可修改的几种方法: 因为select的特殊性,导致它不能像input表单一样简单地设置一个readonly来限制修改,所以,我们需要进行别的操作! 1.为下拉框添加样式,可以 ...

  8. JQuery操作下拉框

    要实现这种效果: HTML: <script src="js/jquery-1.7.2.min.js"></script> <table>< ...

  9. php 获取下拉框选中的文本,jQuery实现select下拉框获取当前选中的文本

    本文主要介绍了jQuery实现select下拉框获取当前选中文本.值.索引以及添加/删除Select的Option项的相关知识,具有很好的参考价值.下面跟着小编一起来看下吧,希望能帮助到大家. 话不多 ...

  10. php zblog 侧边栏样式_zblogphp版如何实现导航栏下拉框

    zblogphp版目前还无任何插件实现导航栏下拉框,根据自己研究和网上的知识,终于研究成功.下面说下实现步骤: 一.在导航条所在模板模板加入更改以下代码 首页{module:navbar} 更改为: ...

最新文章

  1. Graph + AI 2021中国峰会:TigerGraph与行业共探图与AI应用前景
  2. MySQL中truncate误操作后的数据恢复案例
  3. 结对第2次作业——WordCount进阶需求
  4. ORA-12638: 身份证明检索失败 解决方法
  5. 一维傅里叶变换后的复数怎样理解?
  6. Android 中的冷启动和热启动
  7. Windows 10自动更新存在严重缺陷 强制升级搞坏用户硬盘!
  8. VirtualBox中虚拟机IP地址相同
  9. 数据分析之 AB测试(AB Test)
  10. (Java蓝桥杯算法)递归方法求Ckn
  11. java对有英文的日期进行格式化
  12. BGP Aggregation – Suppress Map
  13. PCRF、PCEF、PCC(转帖)
  14. 【计算专业】有趣的拓扑学问题 动画演示
  15. workflow工作流类型及其区别
  16. python list元素类型_阿博的Python之路-详解List数据类型
  17. Altium designer18设置原理图尺寸
  18. Python制作炫酷的个人足迹地图
  19. CSS3制作摇晃的吊灯
  20. MATLAB加入螺旋相位板调制,螺旋相位板

热门文章

  1. 硬盘物理结构详细说明
  2. Deeplab V3+训练自己数据集全过程
  3. 数据库SQL SERVER常用命令说明
  4. Fluent学习笔记
  5. [linux] 命令对应英文全称
  6. CVPR2022 | 曾经火爆全网的算法!升级版来袭,支持卡通形象!
  7. 一键领取饿了么手气最佳红包
  8. 如何在 DAX 计算中隐藏未来日期?
  9. 所有老板看完都会说一句“卧槽”!一套营销方案,彻底颠覆你思维!
  10. Ajax安卓成功iOS失败,api.ajax图片上传,ios可以上传成功,安卓上传失败