![](https://img-blog.csdnimg.cn/20201014180756919.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
Vue
Right atrium
这个作者很懒,什么都没留下…
展开
-
Vue页面生成PDF后调起浏览器打印
首先,需要安装 html2canvas 和 jsPDF 库。创建好后在main.js中引入方法。原创 2024-06-13 17:53:35 · 445 阅读 · 0 评论 -
Vue获得点击元素的兄弟元素,子元素,父元素等
【代码】Vue获得点击元素的兄弟元素,子元素,父元素等。原创 2024-01-18 10:25:56 · 534 阅读 · 0 评论 -
iview的select表单验证必填不通过
iview默认校验数据类型为String,而我的select用的id是number类型的,因为type校验类型不一致,所以导致一直验证不通过。iview在表单内使用select下拉框的时候,select验证为必填,我选择了数据,却一直提示验证不通过。原创 2024-01-18 10:16:17 · 633 阅读 · 0 评论 -
JavaScript十大取整方法
在日常的开发过程中会有各种各样的需求会用到很多不同取整的方法,但是下面的这些方法中应该还是会有你没有用过的方法,了解一下吧。原创 2024-01-17 16:55:48 · 451 阅读 · 0 评论 -
苹果电脑(Mac)的node版本安装以及升降级
在开发过程中,对于不同的开发环境或者较老的项目可能需要切换不同的node版本,此过程会涉及到node版本的升级与降级,安装node版本管理模块n(sudo命令)。6.检测目前安装了哪些node版本(前面带圈的是你当前使用的版本)4.node版本降级/升级(安装指定 node版本)7.切换 node版本(不会删除已安装的其他版本)5.卸载指定 node版本。8.查看 node版本号。sudo n 版本号。sudo n 版本号。原创 2024-01-17 16:29:39 · 2498 阅读 · 0 评论 -
修改iview的表格table展开的默认icon和样式
【代码】修改iview的表格table展开的默认icon和样式。原创 2024-01-17 16:14:50 · 525 阅读 · 0 评论 -
js浮点数计算精度问题(输入19.9乘100后结果1989.9999999999998)
在项目中设置商品价格是输入19.9,因为后端存储的是分所以在接口传递参数的时候需要将输入的数乘100,在乘100后出现精度问题。由于浮点型直接计算可能会出问题,所以可以将其先转为整型计算,乘法先去掉小数点,先转为整数乘法,然后再将结果缩小n倍。此方法只解决了乘法的精度问题,因为加减乘除都会存在精度问题,所以可以在这个的基础上改动解决其他的计算精度问题。原创 2024-01-17 16:00:01 · 548 阅读 · 0 评论 -
H5使用ThreeJs展示3D模型(gltf格式)案例
/ 引入three.js import * as THREE from 'three';// 引入扩展库GLTFLoader.js import {import {原创 2023-07-04 17:06:36 · 1725 阅读 · 0 评论 -
Vue页面滚动到底部触发
一、首先要设置需要滚动的盒子,给div添加overflow-y:auto或overflow-y: scroll样式,然后给盒子添加@scroll事件。二、@scroll事件调用内容。原创 2022-10-17 11:28:50 · 2595 阅读 · 1 评论 -
Vue图片URL下载图片,保存图片到本地
【代码】Vue图片URL下载图片,保存图片到本地。原创 2022-10-14 11:03:39 · 2940 阅读 · 0 评论 -
Vue移除监听事件
原生方法放在 beforeDestroy 或者 destroyed 中,移除时会报错,改用 $refs 要获取 dom 节点,这样就不会报错了。原创 2022-09-14 17:40:44 · 3391 阅读 · 0 评论 -
js(vue)获取本地上传图片的尺寸(宽高)
<input id="file" @change="uploadImegs($event,3)" type="file" accept="image/*" />uploadImegs(e) { let _file = e.target.files[0]; if (_file) { if (!/\.(jpg|jpeg|png|JPG|PNG)$/.test(e.target.value)) { this.$Message.info("图片原创 2021-11-23 21:42:01 · 1705 阅读 · 0 评论 -
Vue拖拽排序组件Vue-Slicksort
一、效果图二、安装组件 npm i vue-slicksort -S三、使用组件<div class="maintenance_img mt50 mb50 pl20 pr20" style="font-size: 16px;font-weight: 600;position: relative;"> <!-- 拖拽 --> <SlickList :lockToContainerEdges="true" lockAxis原创 2021-09-03 14:12:56 · 2111 阅读 · 5 评论 -
Vue点击下载图片
一、同源//下载二维码的事件downloadImg(imgurl) { var url = imgurl var a = document.createElement('a') var event = new MouseEvent('click') // 自定义下载后图片的名称 a.download = '图片' a.href = url a.dispatchEvent(event)},一、非同源down(imgurl) { // 保存二维原创 2021-08-31 18:37:34 · 834 阅读 · 0 评论 -
iView表格(Table)点击展开功能(每一行)
效果图:一、首先我们要在表格(Table)上添加绑定每行的点击事件@on-row-click<Table @on-row-click="onExpand" border :columns="columns" :data="list"></Table>二、在表格(Table)的表头columns中添加一列{ type:'expand', width:30, render:(h,params)=>{ return h('Table原创 2021-08-11 15:35:58 · 2968 阅读 · 3 评论 -
iView输入框禁止输入特殊字符,只可输入中文、数字、字母
一、HTML<Form-item label="导出名称: "> <Input v-model="file_name" @on-keyup="btKeyUp()" @on-keydown="btKeyDown()" type="text" style="width: 280px" clearable placeholder="请输入导出名称" /></Form-item>二、JS//只能输入汉字英文数字btKeyDown(name) { thi原创 2021-08-09 22:33:50 · 1695 阅读 · 0 评论 -
Vue动态设置样式和class名
一、动态设置样式<template> <div :style="{backgroundImage: 'url(' + bgimg + ')', fontSize:'size'}"></div></template><script> export default { data() { return { bgimg: "https://jm-images.oss-cn原创 2021-08-09 11:54:44 · 712 阅读 · 0 评论 -
iview树形数据格式化(递归)
问题:在我们使用iview树形组件的时候,因为后台返回的数据的key值没有办法在iview树形结构中使用,所以我们就要先把数据格式化后才可使用。1、方法//转树形结构数据convertTree(tree, map) { const result = []; tree.forEach((item) => { // 读取 map 的键值映射 let expand = false; let title = item[ map.title原创 2021-07-28 18:43:38 · 683 阅读 · 0 评论 -
js数组调换两个元素的位置
1、方法一let arr = [1, 2, 3, 4, 5]let t = ""// 交换第三个和第四个元素let x = 3, y = 4let t = arr[x];arr[x] = arr[y];arr[y] = t;console.log(arr) /// [1,2,4,3,5]2、方法二let arr = [1, 2, 3, 4, 5]// 交换第三个和第四个元素let x = 3, y = 4 arr.splice(x - 1, 1, ...arr.splice原创 2021-07-27 11:08:25 · 5895 阅读 · 2 评论 -
iview表格(table)组件划过时选中的颜色修改
.ivu-table-row-highlight td, .ivu-table-stripe .ivu-table-body tr.ivu-table-row-highlight:nth-child(2n) td, .ivu-table-stripe .ivu-table-fixed-body tr.ivu-table-row-highlight:nth-child(2n) td, tr.ivu-table-row-highlight.ivu-table-row-hover td{ backgro.原创 2021-07-27 10:12:52 · 560 阅读 · 0 评论 -
vue监听url地址栏参数变化
问题:在开发过程中我们有可能会遇到一个问题,就是在一个vue项目中引入了一个组件,点击这个组件跳转的还是当前的页面,只是传递的参数发生了变化,这个时候我们传递的参数就不能正常的赋值了,这是因为页面没有重新加载,所以我们就要监听地址栏的参数变化了。1、传递参数 this.$router.push({ path: url,//路由地址 query:{//参数 type: 1 } });2、监听参数变化 watch: { //监听路由地址的改变原创 2021-06-30 11:44:33 · 6266 阅读 · 0 评论 -
vue插件实现刮刮乐效果(移动端、PC端)
效果使用方法1、使用npm下载安装插件npm install lzy-scratch-card --save2、在需要使用的页面引入组件import scratchCard from 'lzy-scratch-card'components: { scratchCard},3、在项目中使用<template> <div class="index-body"> <scratch-card elem原创 2021-05-26 17:32:00 · 2955 阅读 · 6 评论 -
在Vue中生成二维码(前端生成二维码:Qrcode)
1、首先我们需要使用"npm install --save qrcode"下载依赖包npm install --save qrcode2、在要使用qrcode的页面导入qrcodeimport QRCode from "qrcode";3、template<template> <div class="index-body"> <div class="qrcode"> <img :src="qrcode"原创 2021-05-21 14:34:19 · 1202 阅读 · 1 评论 -
vue禁止微信内H5上下拉动页面
preventDefault() 方法不会阻止事件通过 DOM 进一步传播。请使用 stopPropagation() 方法来解决。如果事件是可取消的,则 preventDefault() 方法会取消该事件,这意味着属于该事件的默认操作将不会发生。并非所有活动都可以取消。请使用 cancelable 属性 来确定事件是否可取消。原创 2021-04-21 09:40:42 · 1735 阅读 · 0 评论 -
后台返回的内容中有两个空格,显示到前端页面上只有一个空格
主要是浏览器默认只认同字符中间的一个空格,其他忽略掉。<pre></pre>标记<xmp></xmp>标记用以上两个标记包裹住你需要浏览器按照你的预编排的格式输出的内容,这样就可以解决这个问题了。...原创 2021-03-05 15:08:11 · 2439 阅读 · 1 评论 -
Vue上传文件或图片第一次触发,第二次不触发的问题
这个问题主要是文件上传点击一次执行change事件,第二次点击相同的文件会上传不成功,主要是让file的target.value清空一下。重置一遍value,至关重要。原创 2021-01-04 19:16:15 · 1582 阅读 · 1 评论