引用vant cdn 组件 van-cascader 没有效果

最新推荐文章于 2023-11-28 14:34:29 发布
VIP文章 最新推荐文章于 2023-11-28 14:34:29 发布
阅读量2.2k 收藏 1
点赞数
分类专栏： 前端 cdn vant 文章标签： css3 vue.js html5
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_42877655/article/details/122208159
版权

原因：引用cdn版本太低
https://vant-contrib.gitee.io/vant/#/zh-CN/cascader
在其介绍里面有说2.12之后的版本可以，教程里面的也是2.12，但是不行所以我就在想是不是2.12之后，而不包括2.12

请在vant得更新版本里面找到最新版本
https://vant-contrib.gitee.io/vant/#/zh-CN/changelog

我的是v2.12.37
教程给的是[email protected]

<!-- 引入样式文件 -->
<link
  rel="stylesheet"
  href="https://cdn.jsdelivr.net/npm/[email protected]/lib/index.css"
最低0.47元/天 解锁文章
BUG先行者
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
Vant移动端组件库-其他
06-13
Vant 是一套轻量、可靠的移动端组件库。通过 Vant，可以快速搭建出风格统一的页面，提升开发效率。 特性： 1、60+ 高质量组件 2、95% 单元测试覆盖率 3、完善的中英文文档和示例 4、支持按需引入 5、支持主题定制 6、支持国际化 7、支持 TS 8、支持 SSR 建议搭配 webpack，babel 使用 Vant，这样可以使用 webpack 提供的丰富插件和个性化配置。Vant 支持了 babel-plugin-import，通过 babel 插件使用 Vant，可以优化代码体积，提高前端性能。 轻量化 作为移动端组件库，Vant 一直将轻量化作为核心开发理念。为了平衡日益丰富的功能和轻量化之间的矛盾关系，Vant 内部使用了很多的优化方式，包括支持组件按需加载、公共模块复用、组件编译流程优化等。 在应用一系列的优化手段之后，目前 Vant 的组件平均体积仅有 8.8KB，Uglify + Gzip 后约 1KB。 丰富实用的业务组件 Vant 不只是提供基础的UI组件，为了方便开发者快速构建移动商城，Vant 增加了许多移动商城内常用的业务组件。类似于地址管理、优惠券、省市县选择等。
Vant Cascader 级联选择使用 wx小程序
LKX_S的博客
03-08 4128
使用vant 级联选择的主要流程。
微信小程序中引用vant组件库
m0_46694056的博客
12-09 2105
步骤 1、vant组件库里面也有说明，它说package.json 和 node_modulles 必须在miniprogram目录下，可是一般你刚新建一个小程序项目的时候，是没有package.json文件的，所以你要初始化一下，方法如下 打开你新建的小程序项目的根目录，我这里是minicode，当然你不要看我这里有package.json文件啊，我是后来成功了才有的。 在这个根目录用cmd打开，并输入npm init -y，并回车，你的项目中就会有package.json文件了 2、接着还是在小
antd vue Cascader多选设置suffixIcon无效
xiasohuai的博客
01-09 774
antd vue Cascader多选设置suffixIcon无效
微信小程序使用Vant组件，出现 Component is not found in path 错误
热门推荐
竹映平昔
10-21 1万+
错误截屏 解决办法 进入到vant-weapp目录下，将里面的组件全部删除 然后打开 vant的官方git仓库 ：https://github.com/youzan/vant-weapp 将其全部下载下来，再将里面的dis目录代码放入vant-weapp中即可将问题解决！ 成功解决 ...
van-cascader 异步加载
weixin_47541876的博客
09-04 1762
van-cascader 异步加载数据
vant Cascader 级联选择 异步加载
qq_18451629的博客
03-23 8188
<template> <div class="cascader"> <van-field v-model="fieldValue" is-link readonly :label="label" :required="required" :rules="rules" :placeholder="placeholder" @click="show = true" /> &
van-swipe__track------Vant轮播图使用时遇到的一个坑
LK_315的博客
06-04 7009
使用vant组件库遇到的问题
CDN模式使用vant组件 引入之后调用不了组件
qq_36546490的博客
07-11 1021
cdn使用vant
vant中的Cascader 级联选择异步加载地区数据
weixin_43794749的博客
08-12 6992
vant中的Cascader 级联选择异步加载地区数据。
vant 自定义 van-dropdown-item的用法
10-15
主要介绍了vant 自定义 van-dropdown-item的用法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
解决vant title-active-color与title-inactive-color不生效问题
01-18
假如你引入之后发现页面的样式和组件都挂载了，但是console控制台会报错，说xxxx组件没有register,这个时候很有可能是你的vant插件版本有问题，重新下载一个最新的vant就可以了，现在是2.6.0版本 好，接下来继续 在...
解决vue使用vant下拉框van-dropdown-item 绑定title值不变问题
10-15
主要介绍了解决vue使用vant下拉框van-dropdown-item 绑定title值不变问题，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
vant 中van-list的用法说明
01-18
van-list里面的元素不能有float样式，否则会连续触发 load 事件 原代码 <van v-model=active change=getTypeDate> <van v-for=(tab) title=tab.name key=tab.id> <div xss=removed class=pic-content> <...
[“usingComponents“][“van-search“]: “@vant/weapp/search/index“ 未找到 坑关于Vant Weapp中组件引入未找到的解决方案
SOLar7SysteM的博客
01-30 1586
在开发微信小程序时，需要引入一些第三方UI库，这时就需要用到微信小程序的 UI，分享一些遇到的问题 Vant Weapp框架引入组件失败问题:使用Vant 组件 [“usingcomponents”][“van-button”]: “@vant/weapp/button/index” 未找到：[ pages/main-music/main-music.json 文件内容错误] pages/main-music/main-music.json: [“usingComponents”][“van-search”
微信小程序使用vant组件所出现的一些问题
子玉的博客
11-24 1060
第三个是在根目录中，文件project.config.json内， "setting"对象中添加，注意，这个与官方配置有些不同，本身这个对象"miniprogramNpmDistDir":"./"，的属性值是有个地址的，但是我的第三个问题所提示的错误就是找不到路径，多了一层，这个根据 自身情况，如果加上路径报错，那就换成“./”路径。1. 确保你在正确的目录下：确认你当前所在的目录是你的小程序项目的根目录，即包含app.json和project.config.json等文件的目录。希望对大家有所帮助！
vant 组件引入报组件注册错误，＜van-contact-card＞ - did you register the component correctly? For recursive c，解决
lzfengquan的博客
02-23 3791
你看你是不是也是这样的错误 vue.runtime.esm.js?2b0e:619 [Vue warn]: Unknown custom element: - did you register the component correctly? For recursive components, make sure to provide the “name” option. 我们按需引入了，明明按照官网上的还一直报错，查询了百度没得解决，问了以前同学说也遇到了。。。。然后忘记怎解决的了，好吧，自己弄吧。
微信小程序引用vant组件报错路径找不到。
dorlolo的博客
02-21 2525
在vant组件通过npm安装好后，引用组件发生问题，如图所示： 经过反复测试，有以下两种情况： 第一种：用测试号创建的项目，亲测不会有问题。 第二种：用appid创建的项目，因为多了云函数功能，目录结构变了。你会发现，你的本地文件都被存在miniprogram目录中。但安装vant的时候，组件文件夹miniprogram_npm和跑到了外面去。 这时候只要把 miniprogram_npm这个目录移动到miniprogram目录里面就行。 目录结构如图： ...
vant轮播van-swipe无法轮播的小坑解决办法
最新发布
qq_51410764的博客
11-28 984
将van-swipe组件放在要动态显示的div中发现无法轮播，尝试放到其他地方是正常的，经尝试是v-show导致组件无法正常轮播。因此解决方法即为将v-show改为v-if。然后就能正常显示动画了。
vant-weapp 组件van-cascader 怎么默认展开
06-13
你可以在 `van-cascader` 上加一个 `:expand-trigger="hover"` 属性，这样鼠标悬停在选项上就可以默认展开了。如果你想要一开始就默认展开，可以在 `van-cascader` 上加一个 `v-model`，将选中的值赋给 `v-model`，这样就会默认展开对应的选项。例如： ```html <van-cascader :options="options" :expand-trigger="hover" v-model="selectedValue" /> ``` ```js export default { data() { return { options: [ { label: 'Option A', value: 'a', children: [ { label: 'Option A-1', value: 'a-1', }, { label: 'Option A-2', value: 'a-2', }, ], }, { label: 'Option B', value: 'b', children: [ { label: 'Option B-1', value: 'b-1', }, { label: 'Option B-2', value: 'b-2', }, ], }, ], selectedValue: ['a', 'a-1'], // 默认选中 Option A-1 }; }, }; ```

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值