vue.js
文章平均质量分 66
记录vue项目中使用到的插件,使用方法以及遇到的问题
小香菜今天吃什么
这个作者很懒,什么都没留下…
展开
-
vue2 引入高德地图API根据城市定位查询天气
本文基于在创作数据大屏时,需要实时显示当前定位的天气情况,因而引入高德地图API来实现天气的数据可视化。参考文章手把手教你Vue+ECharts+高德地图API实现天气预报数据可视化效果图以上内容就是目前使用到的高德地图API的功能,还有很多功能待探索,在今后使用到其他功能时再做记录。原创 2023-08-21 14:38:57 · 1016 阅读 · 1 评论 -
vue2 使用vue-print-nb实现打印功能
打印对象的回调函数内,this指向当前printObject object对象,that返回Vue对象;打印时发现,打印的效果不是想要的,或者表格边框线显示不全,使用媒体查询设置打印的样式。若想实现分页,给要分页的元素加上page-break-after: always;记录使用vue-print-nb插件实现打印功能的过程。打印的指令值可以是 具体的id值。给打印的区域设置id值。原创 2023-07-06 14:52:55 · 6077 阅读 · 5 评论 -
vue2 使用vue-qr生成二维码并打印二维码
生成的二维码 Data URI 可以在回调中取得,第一个参数为二维码 data URL, 第二个参数为 props 传过来的 qid(因为二维码生成是异步的,所以加个 id 用于排序)实现勾选表格的数据,用表格的selection-change事件,当勾选的数据发生变化时,实时获取到已勾选的数据。该功能需要用到vue-print-nb打印插件,需先安装插件。修改该值可改变实点的颜色,即二维码整体展示的颜色。记录使用vue-qr生成二维码的过程。二维码的内容,即扫出来的结果。存放已勾选的数据生成的二维码。原创 2023-06-27 09:39:09 · 6947 阅读 · 5 评论 -
vue2 draggable拖拽组件的使用及注意事项
可以看到页面上,新拖拽的三个组件显示的orderId是一样的,后来发现造成这个错误是因为,在右边容器添加组件,取该组件的属性时使用的是简单赋值,在拖拽新的组件时,修改了同组件的属性值。在这里,左边的容器拖出时是clone模式,连续拖拽同一个到右边容器时,控制台提示报错,并且组件展示的内容都一样,组件的属性值也被修改成相同的值。需要设置拖拽容器的高度,否则,当容器内没有小块时,高度为0,再想拖拽小块进入该容器就拖不进去了。记录draggable拖拽组件的使用方法以及遇到的问题。拖拽时的动画时间,单位:ms。原创 2023-06-20 15:07:02 · 3738 阅读 · 1 评论 -
vue2 使用svg图标
index.js(引入本地的svg图标),全局注册SvgIcon组件。一是使用本地的svg;二是使用iconfont的symbol格式。第二种方式,使用iconfont的symbol引入方式。使用symbol引入方式,调用SvgIcon组件。使用本地的svg,调用SvgIcon组件。在main.js引入iconfont.js。记录vue项目中使用svg图标的过程。在main.js引入icons文件夹。在src下面创建icons文件夹。第一种方式,使用本地的svg。使用svg图标有两种方式。原创 2023-06-15 11:01:49 · 930 阅读 · 1 评论 -
Vue2 vue-cropper裁剪图片-使用方法及注意事项
记录vue-cropper的使用及过程中遇到的问题原创 2023-06-06 17:06:18 · 2108 阅读 · 2 评论