灵活多变vue常用小案例系列（如何避免把数据写死？）
方法一：动态绑定class对象
方法二：用函数方法动态绑定class
实现鼠标点击效果
这个案例同样适用轮播图的页码器。
原型：事件冒泡
使用了.stop事件修饰符后，不会层层往上报，事件各种独立，我们真实的应用场景是想点击第四个盒子触发事件，没必要去触发其他盒子的点击事件。
先来看看原型：
很遗憾，本人小白一个，目前并不会手动架一个服务器，但还是看到效果的，虽然控制台输出的submit一闪而过，但我们可以确认到它提交的数据默认是上传了的。
在真实应用场景中，我们是不希望把表单数据直接默认给到服务器中的，而是在本地手动收集和提交数据（我们只想看数据打印，而不是提交服务器中）.这时候就用到了.prevent修饰符。
先来看看原型：
某些应用场景我们只希望点击一次，这就用到了.once事件修饰符。
可以看到我们无论点击了多少次按钮，都只会触发第一次的点击事件。
先来看看原型：
而在某些具体应用场景，我们只想捕捉到用户按下回车键那一刻即可，其他的都不需要。
但我们一般不会将数据写死，而是通过变量监控布尔值的变化。
虽然可以实现，但这种体验非常不好。
像这种复杂的逻辑关系,更适合使用computed属性
但还是有缺陷和不足，分数的上下限，其他字符没有限制输入。
vue项目中实现H5调取摄像头扫码扫一扫功能+生成可识别的条形码
案例描述：需求是生成条形码并且在vue项目中实现扫一扫功能并不是拍照上传后端识别那种
项目场景：单纯的h5项目，没办法调用微信等封装好的组件或者js因为有些场景并不在微信自带的浏览器里面
生成条形码使用vue-barcode
使用vue实现h5扫码功能
vite+vue3+threejs实现一个3D模型的展示案例
1.检查npm -v版本和使用对应的vite安装vue3项目
需要安装依赖：npm install
运行：npm run dev
目录结构：
2.threejs官网：
3.安装threejs
4.准备3D模型素材(我这里使用glb格式)和HDR图片，素材网上可以找有免费的。
5.在App.vue中绑定id，挂载，实例化使用
6.在项目中的src目录下创建utils目录，在utils目录下创建Base3d.js脚本
效果展示：手机模型已经加载至场景中，背景是hdr图。
功能展示：用户可以滑动滚轮将模型进行放大缩小，场景360度无死角旋转。