mint-ui框架下picker报错问题

vue+mint-ui 移动端框架Picker 组件实现 省市区 三级联动 移动端实现三级联动 mint-ui api传送门 官网链接 npm 安装 npm i mint-ui -S 引入 Mint UI 分两种形式: 一是完全引入,具体实现方式 在 main.js 写入以下代码: 重要:样式文件需要单独引入 import Vue from 'vue' import MintUI from 'mint-ui' import 'mint-ui/lib/style.css' import App from './App.vue' Vue.use(MintUI) new Vue 阅读详情

项目需求我会有很多个picker选择器,我一开始是这样写的

<mt-picker :slots="windowList[index].weightPicker"></mt-picker>

在data里面有一个windowList数组,上面的index是根据选择的弹窗的类型传入的值,选择windowList第index个子集;

但是这样有一直报错;

报错如下

 一直提示我weihtPicker不存在,但是,mint-ui官网(http://mint-ui.github.io/#!/zh-cn)的上面和这个写的差不多,,,

 然后我换了书写方式:

 <div v-for="(i,index) in windowList" :key="index">
        <mt-picker
          :slots="i.weightPicker"
          v-if="currentwindows==index"
        ></mt-picker>
      </div>

将所有的弹窗写成一个循环,然后根据当前应该显示那个弹窗判断显示隐藏就完成了;

这样有一个缺点:在代码里面会多出来很多的空的div,不知道其他小伙伴有没有解决方式啊。

 

vue mint-ui学习笔记之picker的使用 本文介绍了vue mint-ui picker的使用,分享给大家,也给自己留个学习笔记 Picker的使用 import { Picker } from 'mint-ui'; Vue.component(Picker.name, Picker); API 示例一:picker的简单使用 xxx.vue: [removed] export d 立即下载

相关推荐

SigmaStar(星宸科技)SSC33X系列

目前,SSC33X系列已经量产了接近两年,SDK成熟稳定,功耗表现良好,图像效果出色,广泛应用在AI枪机、AI球机、AI云台机、多目摄像机、停车场闸机、人脸门禁、人脸锁、门铃猫眼等产品上。

Comake Online的博客 1万+

Vue使用Mint-ui的Popup, Picker组件报错问题

报错信息:[Vue warn]: Invalid key "require" in validation rules object for prop "defaultIndex" 解决办法: Mint-ui版本问题: 把最新的"mint-ui": "^2.2.13"版本改成 "mint-ui": "^2.2.11" 后不报错 转载于:https://www.cnblogs.com/tian-l...

weixin_30381317的博客 344

python 爬虫 xpath 存储到数据库

参考

我是张先生 1289

NutUi picker拾取器联动选择记录

记录NutUi picker 多级联动效果

qq_21460133的博客 1270

手把手调试Android 14 ShellTransitions:用Log追踪ActiveTransition与Handler匹配过程

本文详细介绍了在Android 14中调试ShellTransitions机制的方法,重点通过Log追踪ActiveTransition与Handler的匹配过程。文章提供了关键日志点植入策略、Handler匹配机制解析及实战调试案例,帮助开发者解决窗口转场动画中的卡顿和错乱问题,提升系统动画性能。

weixin_42652674的博客 429

温度实时检测预警系统(STC89C51RC+DS18B20)

温度实时检测预警系统

1 兴趣 2 实践 1496

mint-ui Picker 显示异常

最近一个老项目页面显示异常,使用mint-ui Picker显示异常,直接显示成了 数据对象,而不是具体travelName 字段。

forgiveForever的博客 732

【机器人】机械臂控制入门技术栈分享

机械臂控制入门技术栈分享1.前言2.机器人控制入门技术栈2.1.空间描述和变化2.2.运动学分析2.3.动力学建模2.4.控制入门学习3.进阶部分3.1.机器人参数辨识3.2.非线性控制3.3.现代机器人描述方法:指数坐标4.总结 1.前言 今天看到优快云上有个分享个人技术栈的活动,虽然我不是一个正规的程序员,也不搞前端、后端这些,但我一直在优快云上通过写博客对我的学习进行总结,于是我突发奇想,不如我也写一下我的个人技术栈,针对机械臂控制入门的,因为我水平也不高,所以本文内容也许不够饱满,也不够准确,但

要恰饭得嘛 5858

vue+mintUI中picker的总结

总结:这里的原因应该是触发change事件中执行了给第二列赋值的函数,是在函数中用 voucherType[1].values=xxx进行赋值,一开始以为是这样赋值的原因,后来改为this.$refs.xxx.setSoltValues=xxx进行赋值,数据不会覆盖了,change事件中的值和实际选中的值是一一对应的,然后第一列的数据在初始化的时候默认选中第一个,第二列的展示的数据,根据监视第一...

WwangXue的博客 1272

别光看Demo了!用UE5 Lyra框架快速搭建你的多人对战游戏原型(含完整配置流程)

本文详细介绍了如何利用UE5 Lyra框架快速搭建多人对战游戏原型,包含完整的配置流程和实战案例。Lyra作为可直接二次开发的游戏模板,内置了GAS技能系统、Enhanced Input输入控制等核心功能,大幅缩短开发周期。通过替换角色模型、调整武器数值和配置新地图规则,开发者可在48小时内完成科幻团队竞技游戏原型的搭建。

weixin_28717411的博客 457

2024年03月CCF-GESP编程能力等级认证Python编程五级真题解析

下面流程图在yr输入2024时,可以判定yr代表闰年,并输出 2月是29天 ,则图中菱形框中应该填入( )。 A. (yr % 400 == 0) or (yr % 4 == 0) B. ( yr % 400 == 0) or (yr % 4 == 0 and yr %100 != 0) C. ( yr % 400 == 0) and ( yr % 4 == 0) D. (yr % 400 == 0) and (yr % 4 == 0 and yr % 100 != 0)

人生就是一个不断学习的过程 746

Picker日期组件-切换到指定日期前后-选中日期显示错位问题的解决

mint-ui或者element-ui中Picker选择器,支持多个slot联动,实际应用中例如:年、月、日的三级选择联动,省、市、县的三级选择联动等.picker日期组件切换到指定日期的前后,反复操作会报错或者格式上会错位.....................

欢迎大家交流前端开发技术、经验及各种知识沉淀 1501

[特殊字符] 从零构建携程/飞猪机票价格爬虫:Python异步抓取与反爬对抗实战

在出行决策、竞品分析、价格预测模型训练等场景中,稳定获取携程(Ctrip)和飞猪(Fliggy)的实时机票价格波动数据是刚需。然而,这两大平台均部署了业界顶尖的反爬体系——包括但不限于:动态请求签名(SignToken设备指纹采集(UACanvasWebGL接口参数加密(X-Sign_abtestcookie混淆)频率限制与 IP 封禁(滑动窗口 + 行为检测)目录前言:为什么需要自建机票价格爬虫?一、技术选型与项目架构1.1 核心技术栈1.2 系统架构图(文字描述)1.3 法律与道德声明。

2201_76125261的博客 339

Mint-ui 重置表单清空后再次打开mt-picker没有恢复默认第一个选项的问题(设置mt-picker为指定值)

页面中有个表单重置的按钮,来清除所有选项,但是在清除后,再次打开mt-picker,选项值依然是之前的选项,没有恢复到第一个选项,由于之前没有用过mint,所以这里记录一下解决办法

qq_33767912的博客 1088

SAP B1中文培訓教材_SDK

公司内部培训资料,对开发工具 ,DIAPI, UIAPI,Add-ON有详细解说

最新的sdio 4.0 spec 协议标准 带书签 高清完整PDF版

Part-E1-SDIO-Specification-Ver4.00-Final-120220.pdf:最新的sdio 4.0 spec 协议标准 带书签 高清完整PDF版,包括SDIO 接口的外设,SDIO 接口官方协议等。

vue项目使用mint-ui日期选择框时报错

原创! TypeError: Cannot read property 'split' ofundefined <mt-datetime-picker ref="timePick" v-model="putTimeEnd" type="time" @confirm="confirm"></mt-datetime-picker> 原因: 这里使用了mint-ui的...

超级婷 701

怀旧版电脑GBC模拟器

再现原版GBC掌机的界面,电脑运行连游戏界面都一样大小,很怀旧,很真实,(英文版)强烈推荐,很小的文件,很难才找到的。

Mint-UI时间组件起始时间问题

在使用Mint-UI的时候,官方的demo是这样的 &lt;template&gt; &lt;mt-datetime-picker ref="picker" type="time" v-model="pickerValue"&gt; &lt;/mt-datetime-picker&gt; &lt;/template&gt; &lt;scri

sglhp的博客 4859

jdk-8u144-linux-x64.tar.gz.

该资源为搭建Linux系统Java环境用,资源的后缀为tar.gz格式的压缩包

基于mint-ui的城市选择3级联动

1、实际效果 2、首先你需要去下载一个包含中国省份,城市,区县的数据 如下: https://github.com/artiely/Administrative-divisions-of-China(里面包含二级联动数据,三级联动数据,四级联动数据等,找到自己需要的) https://github.com/modood/Administrative-divisions-of-China (一个更好的中国地区数据,推荐用这个) 3、具体代码 主要是用到了mint-ui的picker组件,关于mint-ui的

qq_43248623的博客 394

vue用mint-ui的picker组件封装一个省市区三级联动组件

最近公司在用vue做项目,然后需要做一个省市区的三级联动的功能,于是研究了一下mint-ui,写了效果如下的一个组件 首先我们的数据文件如下形式,将他分开成一个js文件并将数据暴露出来: cityData.js export const CITY_DATA= [ { ...

chuoqinnong5933的博客 408

mint ui------------Picker与Popup的实际运用

最近小生一直在做关于vant 与 mint ui 的小列子,也写了关于他们两种的插件的运用与方法。 这次讲mint ui之Picker与Popup的实际运用: 1.首先我们需要装mint ui 插件   npm install mint-ui --save //淘宝镜像 cnpm install mint-ui --save  2.在main.js在引入 import Mint f...

若如流水 淡淡流过 1万+

vue+mint-ui的picker组件封装一个省市区三级联动组件

最近在用vue做项目,然后需要做一个省市区的三级联动的功能,于是研究了一下mint-ui,写了效果如下的一个组件 我们的数据文件如下形式,将他分开成一个js文件并将数据暴露出来: cityData.js export const CITY_DATA= [ { "id": "110000", "name": "北京市", "city": [ { ...

weixin_44105171的博客 386

mt-datetime-picker open not a function

mint-ui mt-datetime-picker 接受一个open方法以唤起时间组件 例如 this.refs.datepicker.open();这时候dom节点打印this.refs.datepicker.open(); 这时候dom节点打印this.refs.datepicker.open();这时候dom节点打印this.refs.datepicker: vue v-for情况...

_____青絲 392

vue移动端JAVA城市三级联动_vue基于mint-ui实现城市选择三级联动

项目是基于vue2 的移动端项目,供大家参考,具体内容如下1、实际效果地址三级联动 mint-ui picker.png2、首先你需要去下载一个包含中国省份,城市,区县的数据如下:(这个地址里面包含二级联动数据,三级联动数据,四级联动数据等,找到自己需要的)(一个更好的中国地区数据,推荐用这个)3、具体代码主要是用到了mint-ui的picker组件,关于mint-ui的使用就自行看官网Ⅰ、htm...

weixin_39656206的博客 244

Vue Mint-UI Datetime picker 中的起始时间和结束时间

Vue Mint-UI Datetime picker 中的起始时间和结束时间 Datetime picker 效果 1、官网效果 官网上给出了一些 API 文档,但是 Mint UI 的文档 写的真心不怎么样,这里分享一下 Mint UI 的源码,这里是 Datetime picker 的源码。 既然是选择出生日期,那可选日期当然需要做一些限制,粗略地处理为 1900-01-01 ~ 当前时间。注意到文档中的 startDate 和 endDate 可以控制起止时间,但是没有说明如何使用,源码中也没有

weixin_43294092的博客 1311

【巷子】---vue基于mint-ui三级联动---【vue】

一、基本配置   https://github.com/modood/Administrative-divisions-of-China   三级联动数据地址 二、vue基本配置   1、cnpm install mint-ui --save-dev   2、引入     import MintUI from 'mint-ui'     import 'mint-ui/lib/s...

weixin_30510153的博客 89

vue中使用Mint UI以及排坑

1、Mint ui介绍 Mint UI 是饿了么团队开源的一款基于 Vue.js 的UI组件库(主要是针对移动端) 特性: (1)、Mint UI 包含丰富的 CSS 和 JS 组件,能够满足日常的移动端开发需要。 (2)、按需加载组件,可以加载声明过的组件,不必要引入全部的UI组件,需要用什么就选择性的用什么,这样可以减小我们项目的体积,加快加载速度。 (3)、在移动端渲染性能高,体验流畅 ...

k393393的博客 731

vue移动端日历组件 mintUi dateTime picker 设定开始和结束日期

=====================================追加提示2018.9.17=============================== 继续填坑 如果你想修改 这个组件的 取消和确定按钮 则需要像下面的startDate一样 在标签上写 :cancel-text 和 :confirm-text 然后用一个vue变量接一下 设定一下值就可以了 这里我只想...

gaoqiang1112的博客 3万+
上一篇: vue页面之间相互传值的方法
下一篇: 判断当前在input 中输入的元素是第几位
impossible1994727
博客等级 码龄10年 4364粉丝 194原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

impossible1994727

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值