最近在学习vue3，为了更好的实践，所以着手将手头以前做过的项目升级为vue3来对比看看都有哪些变化。于是将手头的项目数据大屏视频监控智能分析系统进行vue3升级。之前的项目中要引入百度地图vue-baidu-map，这里有些变化要记录一下。vue2项目使用百度地图请查看：vue...
yekong
1年前 (2023-09-28)
喜欢
数据可视化大屏项目中，需要添加一个登录功能，这时候我们就需要对那些登录后才能访问的页面进行鉴权处理了。
import {createRouter, createWebHashHistory} from 'vue-router'
const routerHistory = cre...
yekong
1年前 (2023-09-22)
喜欢
数据可视化大屏项目开发中，登录页需要一个验证码发送功能，这里我们来实现这个功能。
使用
<captcha :phone="phone"></captcha>
创建组件captcha
组件接收电话号码，使用label来显示获取验证码，...
yekong
1年前 (2023-09-22)
喜欢
在Vue 3中，你可以使用createApp函数来创建Vue应用，并使用app.use()方法全局注册和初始化AOS。以下是在Vue 3中全局注册和初始化AOS的示例：
安装AOS和Animate.css：首先，确保你已经安装了AOS和Animate.css。你可以通过npm或...
yekong
1年前 (2023-09-12)
喜欢
vue3数据可视化大屏项目开发中，需要一个24小时时间段，时间段可以点击选择，可以多选以用来记录时间段。
通过鼠标可以选择时间点，点击保存后可以将数据通过localStorage缓存到本地。
效果截图
演示地址
vue3实现时间段布防时间效果
项目应用
视频监控智能分析系统
部...
yekong
1年前 (2023-09-11)
喜欢
当然，如果你需要批量引入大量图片并将它们放入数组中，可以使用以下代码：
const images = [];
for (let i = 0; i <= 74; i++) {
images.push(require(`./topbg/topbg_${i}.png`).de...
yekong
1年前 (2023-08-23)
喜欢
动态效果
演示地址
vue3使用particles.js粒子特效
vue3项目在使用particles.js组件的时候会报错，我们需要调整一下让其可以正常运行。
The requested module '/node_modules/.vite/deps/particles_...
yekong
1年前 (2023-08-06)
喜欢
vue3 数据可视化大屏项目开发中，登录页面一般都需要记住密码功能，我们来实现这种功能。
使用组件
引入组件
import rememberPwd from "./rememberPwd.vue";
使用
components: {rememberPwd},...
yekong
1年前 (2023-08-04)
喜欢
数字滚动效果
动画效果
在Vue.js中，可以使用countUp.js插件实现数字滚动。这是一个独立的，能让你创建动态递增或递减的数字动画的JavaScript库。
首先，你需要在项目中安装这个库：
npm install countup.js --save
然后，在你的组...
yekong
2年前 (2023-07-31)
喜欢
项目开发中，使用vue3的写法时，使用watch监听props没有触发接口请求
在 Vue 3 中，由于一些性能优化，watch 不会监听到 props 的变化。对于这种情况，可以使用 watchEffect 来替代 watch。下面是代码修改后的版本：
<script s...
yekong
2年前 (2023-07-28)
喜欢
![vue3 watch([props.id,], getData); 监听props数据变化后请求接口](https://images.wanjunshijie.com/img/pic/9.jpg?imageView2/1/w/200/h/123/format/jpg/interlace/1/q/75|watermark/2/text/5a6M56uj5LiW55WM/font/5pa55q2j6buR5L2T/fontsize/240/fill/I0ZBRjZGNg==/dissolve/100/gravity/SouthEast/dx/10/dy/10)