优秀的网站要对用户的互动做出反应，做到这一点的一个很好的方法就是对有人向下滚动你的页面做出反应。 除了视差组件和滚动事件外，添加响应式触摸的一种好方法是使元素在滚动视图时淡入。在本每日技巧中，我介绍了如何使用滚动事件和CSS转换在Vue3中实现此功能。这是我们将学习如何在本教程中进行构建的屏幕截图。 本教程效果 样式化我们的fadin元素我们要做的第一件事是构建模板并设置组件
最近在写vue项目，需要由后台传来当前用户对应权限的路由表，前端通过调接口拿到后处理(后端处理路由)，就是配置vue动态路由啦。由于错信了一些网上的文章:(，导致在这个问题上耗费了不少时间，想想，还是自己写一篇文章来记录一下那些遇到的坑吧。接下来手把手记录一下，如何从零开始配置vue动态路由。首先呢，先看看静态路由的配置，简单预览一下，熟悉的可以直接跳过，说这部分，是为了熟悉一下路由的配置，配置动
转载
2024-03-03 12:59:10
123阅读
Vue中如何进行表单验证码与滑动验证？在Web应用程序中，表单验证码和滑动验证是常见的安全机制，用于防止恶意攻击和机器人攻击。在Vue中，我们可以使用许多不同的库来实现这些功能。本文将介绍如何使用Vue和vue-verify-code库来实现表单验证码和滑动验证功能。安装vue-verify-code库首先，我们需要安装vue-verify-code库。可以使用npm来安装：npm install
大家好~ 我是前端uio，本文主要使用vue3制作web端自定义轮播图动画效果（完整版保姆级教程，附源码） 有什么疑问都欢迎私聊或者在评论区留言。如果需要开发web网页或者微信小程序都可以找我私聊，我会尽可能回答我了解的内容。一、功能说明1.最终效果
自定义轮播图 2.图片切换 i）先使用Dom操作获取图片信息let curre
转载
2024-09-25 15:08:27
139阅读
上期的Excel魔法世界，我们介绍了Excel的表格冻结，筛选，日期函数，分列，条件判断公式以及vlookup函数。这篇文章我们会分享Excel另外一些特别实用的功能和技巧，包括IF的嵌套函数，单变量求解，敏感性分析，MID函数，数据透视表基础和Excel的打印技巧。希望大家可以从中感受到Excel的魔法魅力，并且能够多多练习和运用。IF的嵌套函数IF的嵌套函数非常实用，可以用一个公式将一整列数据
腾讯地图选择地址引发的一系列问题2019/12/14更新 修复了自治区/直辖市无法选择的bug（比如上海之类的城市） 采用更加友好的方式来选择地址 新的文章链接：vue中使用腾讯地图选择地址（二） 不过新的文章多数都是代码，思路还是在这篇文章这里！使用腾讯地图的地图组件，获取用户经纬度和当前地址遇到的问题：选择地址的回调路径不兼容哈希路由回调后腾讯地图返回了完整的地址，而我需要省市区具体名称获取省
之前呢写过这种篇章的博客，但是有时候还是有点问题的，这个呢代码和人是一样的，他喜欢活灵活现哈哈，下面在总结以下！
滚动到底部加载数据这个呢可以使用@scroll事件也可以获取可视区高度、
滚动高度、页面高度判断去写。 具体如何实现呢？结合着代码去讲解，以及遇到的坑！！！<template>
<div>
// 这里呢内容随便写，只要超过了可视区就可以触发事件
转载
2024-10-20 11:04:50
173阅读
其实我是要在手机端实现虚拟列表（web端其实有很实用的插件可以用，没必要自己实现）。找了两天资料，也没有找到一个我满意的方案。最后看到一片比较通俗易懂的文章，按照他的方案实现了基本的虚拟列表。PS:功能虽然实现了，但是还有小问题，比如快速滚动时效果一般。性能也还未测试。uniapp下的坑做虚拟列表，首先得能拿到滚动条的数据，也就是滚动监听事件。网上找了好久，基本就两个方案：基于document什么
转载
2024-06-06 16:03:34
283阅读
虚拟滚动的理解既可以滚动加载，也不会额外增加DOM数量，随着滚动变化原有几个DOM元素的值思考1. 容器该如何布局 ？2. 如何动态变化可视区域内dom的值 ？3. 滚动条的长度如何控制？4. 如何判断上拉触底了 ？列表容器的布局1. 新建一个组件ListScroll，容器内部含：滚动条盒子、展示的列表盒子、加载提示盒子2. 注意最外层的容器viewport高度设置100%，让父组件去决定List
转载
2024-05-31 01:20:40
879阅读
前言移动端网页的日常开发中,偶尔会包含一些渲染长列表的场景.比如某旅游网站需要完全展示出全国的城市列表,再有将所有通讯录的姓名按照A,B,C...首字母依次排序展示.长列表的数量一般在几百条范围内不会出现意外的效果,浏览器本身足以支撑.可一旦数量级达到上千,页面渲染过程会出现明显的卡顿.数量突破上万甚至十几万时,网页可能直接崩溃了.为了解决长列表造成的渲染压力,业界出现了相应的应对技术,即长列表的
转载
2024-09-19 13:12:30
242阅读
el-table表头添加勾选框嘚吧嘚实现 嘚吧嘚table的行勾选是比较常规的操作，但是有的时候就有各种奇葩的需求蹦出来。? 比如最近有一个需求，不仅需要勾选行，还需要勾选列，其实我心中有了一万头可爱的小羊驼，但是实际上还是很从心的屈服了。?具体要求如下： 1、行可勾选。 2、非必须列(字段)表头添加复选框，可勾选；必须列(字段)表头无复选框，不可勾选。 3、每行的数据由两部分组成，必须字段加勾
可以直接使用的
vue 虚拟滚动<template>
<div class="v-scroll" @scroll.passive="doScroll" ref="scrollBox">
<div :style="blankStyle" style="height: 100%">
<div v-for="item in tempSan
转载
2024-08-13 15:10:36
282阅读
以前接触过一个后端管理系统， 叫H+， 偶尔发现它用的是左侧菜单没有滚动条， 于是， 我仔细查看dom， 发现H+ 左侧菜单的旁边有一个小的DIV， 我拖动的， 菜单竟然也能滚动， 我明白了， 这是用的虚拟滚动条， 我感觉这个挺不错的， 后来查看这个虚拟滚动条的源码， 发现是一个款叫做SlimScroll的基于jquery的库。由于我对Vue比较熟悉，所以，我想用Vue做一个类似的。不断踩坑一开始
转载
2024-07-29 09:28:32
482阅读
在vue中使用Better-Scroll，完成平滑滚动效果BScroll官方文档此博客参考于以上的官方文档，并加以vue的小Demo建立。引言、BetterScroll 是什么BetterScroll 是一款重点解决移动端（已支持 PC）各种滚动场景需求的插件。它的核心是借鉴的 iscroll 的实现，它的 API 设计基本兼容 iscroll，在 iscroll 的基础上又扩展了一些 featu
Vue下滚动到页面底部无限加载数据Demo
看到一篇
Implementing an Infinite Scroll with Vue.js, 觉得挺实用的就看了下, 顺便简单翻译了一下给需要的人参考.
从这个项目中可以加深对Vue的生命周期的理解, 何时开始axios请求, 如何结合Vue使用原生js来写scroll事件等等, 我这里主要是对原文的重点提取和补充本文技术要点 V
vue-elemnt-admin源码学习 vue-element-admin是一个基于vue，element-ui的集成的管理后台。它的安装部分就不说了，按照官网的步骤一步步就可以执行了。 https://panjiachen.github.io/vue-element-admin-site/zh/
原创
2022-01-18 09:30:40
535阅读
<template> <div ref="virtual" class="virtual-empty" :style="{ height: height + 'px' }"> <div class="virtual-container" :style="{ height: clacHeight + ...
转载
2021-08-24 18:25:00
536阅读
2评论
一、问题描述表单中某下拉框，由于数据过多，选择的时候会因为数据量过
原创
2023-07-22 08:19:02
978阅读
vue-cli2 升级 vue-cli3由于vue-cli2 版本太低，升级到vue-cli3 采用的方法是新建cli3项目，对比差异，在cli2项目单独升级检查环境node环境检查版本是否在8.11版本以上npm uninstall vue-cli -g 卸载旧版本的vue-clinpm install -g @vue/cli 安装新版本新建cli3项目vue create 选择自定义安装按空格
转载
2024-02-21 12:20:28
280阅读
elemet-ui里提供的upload文件上传组件,功能很强大,能满足单独使用的需求,但是有时候会存在多次复用上传组件的需求,如下图的样子,这时候就出现了问题,页面上有多个上传组件时,要怎么操作呢? 之前在网上找到了一位大神的方法,修改源码,在回调函数中多加一个参数,但是这种方法在多人开发时不太适用,因为这要求所有人都要修改源码,这里附上大神的方法,大家可以酌情使用首先在你下
转载
2024-07-04 22:40:14
471阅读
