uniapp+vant组件开发微信小程序遇到的离奇事件

最新推荐文章于 2024-03-12 10:05:53 发布
最新推荐文章于 2024-03-12 10:05:53 发布
阅读量462 收藏 9
点赞数 8
文章标签： uni-app 微信小程序 小程序
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_46541256/article/details/135900360
版权

事件起因是当我像往常一样试用vant组件来开发微信小程序时发现 弹出层（poput）不生效了页面也没有任何报错查看html元素 这个弹出层的标签也在但就是没有弹出我想要弹框，后来通过博客找到了 【vant-weapp文档】  发现vant组件要针对微信小程序 使用 :show来实现显示隐藏 而不是 v-module ，所以大家写的时候可以参考vant-weapp文档来开发避免出现这种找不到报错的问题而苦恼只能用清理缓存来安慰自己  【裂开】

传送门：介绍 - Vant Weapp (gitee.io)

不会技术
关注
  • 8
    点赞
  • 踩
  • 9
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
移动端vant的踩坑
weixin_58896221的博客
08-03 844
vant报错问题
uni-app 开发微信小程序使用 vant popup时v-model无效
Mr_BigWu的博客
06-20 3684
使用uni-app和vant开发时因为粗心大意遇到的问题
如何在uniapp-vue3引入vant4 ui库
qq_40987210的博客
02-22 2643
如何在uniapp-vue3引入vant4 ui库
uni-app自定义v-model失效问题
halo1416的博客
05-19 2345
但在实际开发中，我们可能更多的基于这一个逻辑去实现自定义的model。中定义model的时候用value和input，不能自定义更改。文章仅为本人学习过程的一个记录，仅供参考，如有问题，欢迎指出！小程序中这样自定义是不会生效的。
uni-app中v-model在小程序端运行报错处理
m0_49016709的博客
09-30 3308
开发中双向数据绑定 v-mode在小程序端运行时会报错， 处理方法绕过v-model 获取input输入框的值 ,看代码： <input type="text" placeholder="请输入账号" :value="loginName" @input="getLoginName($event)"> <input type="text" :password="passWordLock" placeholder="请输入密码" :value="passWord" @input="getP
uniapp 如何使用 Vant 组件库
sisi440102的博客
01-04 2575
解决使用uniapp时，引入vant组件库
实战避雷记录 | 关于uni开发小程序引入vant weapp事件失效
zerobiu的博客
03-08 977
①最初引用vant开发小程序的时候是原生开发，此次用uniapp开发小程序项目时也想着引入使用下。②结果遇到的问题是展示内容比如输入框这种的都可以，但是点击事件的时候出不来效果。③一开始想着是不是版本用错了，后面看了下文档针对小程序的版本就是weapp的。把usingComponents挪到globalStyle里面全局引入就好了。不能在pages中局部引入组件。一顿试错之后，发现原来。
uniapp 中 引入vant组件 和 vant 报错Unclosed bracket 的问题解决
weixin_44168929的博客
06-28 2863
在uniapp 中引入vant组件，遇到一个报错，所以在此记录一下完整过程。
解决在HBuilderX里用uniapp引入vant后在微信小程序里没反应的问题
weixin_56924782的博客
09-20 2538
解决在HBuilderX里用uniapp引入vant后在微信小程序里没反应的问题
uniapp微信小程序引入vant组件库
章小鱼的博客
06-01 4642
使用uniapp写微信小程序时，使用vant组件库
Vant-UI中的组件，DatePicker在IOS系统中出现不兼容情况，不显示日期？
lzl770880的博客
09-20 782
近期在开一个小功能的时候，用到了DatePicker组件，编写完代码，运行在测试环境中，安卓与IOS系统完美运行，然后就直接上线了，但是过了几天，就收到客户反馈，苹果手机没有显示日期出来。接到反馈，就是看了代码都没问题，就上了官网查看，看到了有提示，原因为：如图所以。将时间格式更改为"yyyy/MM/dd"即可，解决这个问题。
uniapp 集成vant报错
小漠007的专栏
06-04 309
全文搜索：.woff，找多对应的文件，右键格式化后保存，重新允许就可以了。系统：mac os monterey 12.6。
uniapp 全局引入vant 组件库
m0_64373473的博客
09-12 5306
【uni-app】uniapp 全局引入vant 组件库。
如何在uni-app中使用vant组件？最细教学，还看不懂你来捶我
m0_74052733的博客
10-17 1万+
在我们刚才新建的wxcomponents 目录下新建一个 @vant 的文件夹，建立目录方法就和步骤三一样，只不过这一次我们要在 wxcomponents 目录下建立 子目录 @vant。最近在做uni-app的时候需要用到vant组件，在网上看到了很多的使用vant组件的方法，但是讲解的大多繁琐，或者无法使用，现把最新，最实用的vant组件的使用方法分享给大家。再多提一嘴，vant组件是配合原生小程序使用的，所有有些地方，比如data数据渲染，我们不能直接照抄，一般用vue的思路就可以解决啦。
从0搭建，在uniapp中使用vant组件
Gjing_123的博客
02-06 891
在uniapp中使用vant（手把手教搭建，从0开始）
uniapp是否可以用vant等移动端UI库、使用步骤以及需要注意的问题
商务合作 / 项目定制开发 / 前端一对一培训、答疑
12-04 5583
解决方法，修改 ~node_modules\vant\lib\index.css 文件，将该文件中的 “url” 改为 “ url” ，一共需修改2处。其他问题，请参考：https://github.com/youzan/vant/issues?原因是微信小程序不支持document，window对象，所以navigator自然是无法使用的。参考文章：https://github.com/youzan/vant/issues/12421。1、安装Vant Version 2.13.2后，导入样式，报错。
关于在uniapp写微信小程序使用vant方法
最新发布
m0_69896158的博客
03-12 883
关于在uniapp写小程序使用vant方法(真实有效)
uni-app下使用vant组件
热门推荐
wangmj518的专栏
03-12 2万+
1. 创建uni-app 下载打开HbuilderX,注意这里下载app开发版的。然后创建新项目，创建的时候选择uni-app默认模板 2. 下载vant组件 vant的GitHub下载地址下载完成后解压，然后在项目更目录下创建文件夹wxcomponents，注意这里的wxcomponents目录级别和pages在同一级别，然后再该目录下创建vant目录。回到刚才解压的vant目录，找到dist文件夹，把它复制到vant目录下 3. 引用vant组件 3.1 首先在app.vue文件内添加
在uni-app项目里使用vant框架
m0_67251803的博客
06-23 1724
在uni-app项目里使用vant框架
微信小程序+vant组件 侧边导航栏滚动
09-10
微信小程序中使用 Vant 组件库的侧边导航栏滚动，需要首先在项目中引入 Vant 组件库，并且按照 Vant 的文档进行组件的配置和使用。 首先，在项目根目录下的 `app.json` 文件中配置 Vant 组件的全局样式，示例如下： ```json { "style": "vant-weapp/dist/common/index" } ``` 然后在需要使用侧边导航栏滚动的页面中引入 Vant 的侧边导航栏组件，并按照需求设置好相关属性和事件，示例如下： ```html <van-sidebar show="{{ true }}" width="200rpx" :style="height: 100vh;"> <van-sidebar-item v-for="(item, index) in menuList" :key="index" :title="item.title" :dot="item.dot" :badge="item.badge" /> </van-sidebar> ``` 其中，`show` 属性用于控制侧边导航栏的显示与隐藏，`width` 属性用于设置导航栏的宽度，`:style` 属性用于设置导航栏的高度为可视区域的高度。 此外，需要根据实际需求在 `data` 数据中定义 `menuList` 数组，并为每个侧边导航栏项设置相应的标题、角标和小红点。 最后，在页面的生命周期函数中，通过监听滚动事件来实现侧边导航栏的滚动效果，示例如下： ```javascript Page({ onScroll: function(event) { // 根据滚动位置处理侧边导航栏的样式 } }) ``` 在监听滚动事件中，可以根据滚动位置来处理侧边导航栏的样式，例如高亮当前正在滚动的导航项。 总结起来，要在微信小程序中使用 Vant 组件库的侧边导航栏滚动，需要首先引入 Vant 组件库并进行配置，然后在页面中按照需求引入侧边导航栏组件并设置相应的属性和事件，最后在监听滚动事件中处理导航栏的样式即可。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值