vant
vue3 使用 vant 实现列表上拉加载、下拉刷新
## 实现方式 实现了列表的上拉加载、下拉刷新，使用的是vant库中的 [List](https://vant-ui.github.io/vant/#/zh-CN/list) 和 [PullRefresh](https://vant-ui.github.io/vant/#/zh-CN/pull-re ......
vue中使用vant中PullRefresh 下拉刷新踩坑
## 问题 PullRefresh 的内容未填满屏幕时，只有一部分区域可以下拉： ``` 内容 ``` ##解决 我们需要给 .van-pull-refresh__track 一个高度就可以了，代码如下 ``` ``` ## 注意 在修改css样式时，出现了一个错误，一开始使用的是以下代码来修改 . ......
vue项目结合vant，实现上拉加载更多，下拉刷新
上拉加载思路： 1. 引入vant 组件 上拉list 2. 后端数据做了分页处理，获取接口数据，渲染到页面上,(此处只会显示一页的数据) 3. 设置属性去实现效果，loading,finished为vant组件中提供的 4. 每次滚动到底部后把页面数+1，发送一次请求获取新分页数据. 5. 获取完 ......
vue3+vant3封装省市区组件
因为后台返回的数据格式和vant不一致，所以自己遍历循环得到自己想到的格式。 省市区的接口并不是一个以children格式，一次性全部获取，而是选择市的时候需要得到省的id，一层一层请求接口才能得到省市区。 父组件： 1 <selectArea 2 @addressOnFinish="onChang ......
vue2+vant2+rem+axios+钉钉自动登录 h5模板
下载代码 请轻轻的点一下这里~ Node 版本要求 Vue CLI 需要 Node.js 8.9 或更高版本 (推荐 8.11.0+)。你可以使用 nvm 或 nvm-windows 在同一台电脑中管理多个 Node 版本。 本示例 Node.js 14.17.0 启动项目 npm install ......
vant list列表 滑动加载
瀑布流滚动加载，用于展示长列表，当列表即将滚动到底部时，会触发事件并加载更多列表项。import Vue from 'vue'; import { List } from 'vant'; Vue.use(List);<van-list v-model="loading" :finished="fin ......
vant ActionSheet组件嵌套多层时，第一层的顶部和底部不会被覆盖
问题描述： 这是一个只有在ios真机测试的时候才出现的问题，使用浏览器本地调试和安卓真机测试的时候都没有这个问题。 在一个页面中点击一个按钮的时候会出现 ActionSheet 动作面板 这个面板里主要是一个表单需要填写 和确定、取消按钮。 其中有选人组件 这个组件也是用 ActionSheet 动 ......
vant 安装
一、vant 简介 二、安装 三、问题 一、vant 简介 Vant 是一个轻量、可定制的移动端组件库，于 2017 年开源。 我是一个vue项目要使用到前端框架，就使用了这个，感觉还蛮好用的。 二、安装 1、可以进入官网查看安装攻略。 命令行到自己的项目目录下 我使用的是vue3,所以安装组件是 ......
vant中van-dialog组件点击确认按钮禁止弹窗自动关闭
1.在van-dialog组件中添加 before-close 属性, 2.定义该方法 newGroupBefColse(action, done) { if (action == 'confirm' && !this.newFenzuName.trim()) { done(false) } els ......
使用vant4+vw创建webapp项目
包来源 自动引入 vue/vue-router/vuex 等api (ref, toRefs....) npm i unplugin-auto-import --save-dev vant按需导入的插件 npm i unplugin-vue-components -D 使用vw布局替换px单位插件 ......
vue项目结合,vant 实现中轮播图中，点击图片放大图片
思路： vant中提供函数 ImagePreview 给原每一个图片子元素设置点击事件，api中提供 initial-swipe 索引，拿到原图索引 设置change事件，保存大图切换的对应索引给到自己的 initial-swipe索引中 设置图片预览切换时，根据切换后的索引，设置原图的位置，大图原 ......
vue3+vant创建移动端项目，实战项目常见采坑记录
前言： 产品背景介绍 我所做的这个项目，刚开始是没有移动端需求的，等PC端做完了上线使用了几个月后，突然有一天产品经理找到我说是要做一个在PC端添加一个快速注册入口，用手机微信扫二位码进入移动端注册页面，用户注册。 所以本次需求就是在PC端添加一个tool-tip气泡型弹出二维码，再开发一个移动端注 ......