分类:vue

vue开发笔记

vue 使用gsap 按钮点击实现一个旋转动画

vue 使用gsap 按钮点击实现一个旋转动画
vue 数据可视化大屏 项目开发过程中,需要实现一个按钮,按钮要可以点击,点击后,对应的图标需要有一个旋转的动画效果。 实现代码 <template> <div class="refresh" @click="getRefr...

2年前 (2023-07-01) 喜欢

vue3 两级树列表效果

vue3 两级树列表效果
vue3 两级树列表,父节点可以展开收缩 可以全选和取消全选 子节点可以选中 子节点全部选择后父节点自动选择 可以按照以下步骤进行操作: 在Vue组件中,创建一个包含树的数据的数组,每个节点包含id、label、selected、expanded和children属性。 在模板...

2年前 (2023-06-28) 喜欢

vue 使用aos动画插件

vue 使用aos动画插件
aos是和wow插件类似的动画插件,二者效果是差不多的,区别是aos.js能在页面回滚的时候,元素能回到之前的状态,这样可以实现循环动画效果 演示效果 演示效果 Vue AOS(Animate On Scroll)是一个用于在滚动时添加动画效果的Vue.js插件。它基于AOS库,...

2年前 (2023-06-28) 喜欢

vue gsap 实现上下浮动的效果

vue gsap 实现上下浮动的效果
GSAP(GreenSock Animation Platform)是一个强大的JavaScript动画库,它可以用于创建各种动画效果,包括上下浮动的效果。 要实现上下浮动的效果,你可以使用GSAP的gsap模块来创建动画。下面是一个示例代码,展示了如何使用GSAP来实现一个元素...

2年前 (2023-06-28) 喜欢

vue3 路由开启history模式

vue3 路由开启history模式
vue3开发的 数据可视化大屏 项目中客户觉得地址中带有#号太丑了,所以需要开启history模式,来去掉#号。 要在Vue 3中开启路由的history模式,需要进行以下步骤: 安装Vue Router 安装Vue Router:确保已经安装了Vue Router依赖包。可以使...

2年前 (2023-06-25) 喜欢

vue 全屏视频调整窗口大小后导致视频错位显示

vue 全屏视频调整窗口大小后导致视频错位显示
vue项目开发中,使用视频作为全屏背景的时候,当调整页面大小的时候,会导致视频位置偏移,解决思路,当窗口变化后,重新获取窗口大小,赋值给视频的父div即可。 实例代码 <template> <div class="shipinbg" r...

2年前 (2023-06-25) 喜欢

vue3 数据可视化大屏头部组件-物流园区数据可视化大屏

vue3 数据可视化大屏头部组件-物流园区数据可视化大屏
数据可视化大屏 页面都会有一个特色的头部,用来放标题时间以及菜单等效果,为了方便复用可能会出现的头部,这里将可能会遇到的 数据可视化大屏头部组件 都整理出来方便复用。今天整理的来自数据大屏:物流园系统可视化页面 头部组件。 效果截图 帧动画效果 通过ae实现从两侧到中间的扫光动...

2年前 (2023-06-22) 喜欢

vue3 数据可视化大屏头部组件-数据资产

vue3 数据可视化大屏头部组件-数据资产
数据可视化大屏 页面都会有一个特色的头部,用来放标题时间以及菜单等效果,为了方便复用可能会出现的头部,这里将可能会遇到的 数据可视化大屏头部组件 都整理出来方便复用。今天整理的来自数据大屏:数据资产 头部组件。 效果截图 帧动画效果 通过ae实现从两侧到中间的扫光动画,使用帧动...

2年前 (2023-06-22) 喜欢

vue3 数据可视化大屏头部组件-智能停车管理统计平台

vue3 数据可视化大屏头部组件-智能停车管理统计平台
数据可视化大屏 页面都会有一个特色的头部,用来放标题时间以及菜单等效果,为了方便复用可能会出现的头部,这里将可能会遇到的 数据可视化大屏头部组件 都整理出来方便复用。今天整理的来自数据大屏:智能停车管理统计平台 头部组件。 效果截图 帧动画效果 通过ae实现从两侧到中间的扫光动...

2年前 (2023-06-22) 喜欢