在添加动画的时候考虑到交互效果,需要鼠标移入时,再进行动画播放,鼠标移出后,动画停止,封装一下以便于进行复用。
/**
* @Author: 858834013@qq.com
* @Name: lottiePlay
* @Date: 2022-08-24
* @Desc: 动画播...
yekong
2年前 (2022-08-24)
喜欢
vue数据大屏项目开发时,常常需要在每个item的四个角增加图片修饰,让其看起来更加美观,前端切图的时候,如果将这些部分以一个整体做成背景图片资源占用会增加,为了节省图片,一些可以item可以做成四个角标图片分别放在四个角上,这样可以节省图片,并且可以复用,不担心变形。于是将其封...
yekong
2年前 (2022-08-23)
喜欢
因为table自带的样式不太友好,设计稿的样式挺好看,就将其封装成一个组件,以后可能会复用,先收藏一下。
使用
<tableCom :t-header="tHeader" :key-val="keyValList" :list=&q...
yekong
2年前 (2022-08-22)
喜欢
vue需要一个步骤条的组件,但是element ui组件的步骤条和自己需要的还是有点差别的,于是自己写了一个,并记录下来。
使用组件
<steps :list="stepsList" :active="stepsActive">...
yekong
2年前 (2022-08-21)
喜欢
没事的时候,就逛逛lottie动画实例,将一些可能会用到的动画效果收藏记录下来,说不定哪天就用到了。今天收藏的是书签收藏效果。
通过点击书签来切换动画效果。
效果预览
git地址
书签效果
...
yekong
2年前 (2022-08-20)
喜欢
一个纷飞效果的动画,可以给某些按钮做图标,当按钮被点击后,就触发这个动画。看起来一定很带劲.
效果预览
git地址
纷飞效果动画
...
yekong
2年前 (2022-08-20)
喜欢
通过3个div的叠加外,使用js控制div显示隐藏来达到类似爆炸一样的视觉效果。
推荐使用lottie实现方式
lottieweb 爆炸效果动画收藏
实际项目
在实际项目中的运行效果-vue数据可视化大屏外包实例-重要目标预警与智慧分析系统
代码
<template&...
yekong
2年前 (2022-08-20)
喜欢
记得之前有个页面要做爆炸效果,当时是通过css加js实现的效果并不流畅,今天看到一个效果很好的lottieweb动画 记录一下。
效果预览
css js 动画效果
css js 动画效果
git地址
爆炸动画
...
yekong
2年前 (2022-08-20)
喜欢
最近需要一个组件将接口返回的数据导出为Excel,将实现过程记录一下,并进行封装,以达到开箱即用,节省开发时间。
首先安装依赖
npm i file-saver --save
npm i xlsx --save
npm i script-loader --save
使用组件
/...
yekong
2年前 (2022-08-20)
喜欢
安装依赖
首选需要安装城市数据依赖
cnpm install element-china-area-data -S
说明
provinceAndCityData是省市二级联动数据(不带“全部”选项)
regionData是省市区三级联动数据(不带“全部”选项)
province...
yekong
2年前 (2022-08-18)
喜欢