常用方法
2020-10-29 本文已影响0人
彬_哥哥
vue element中input限制只能输入正整数
@input="(val)=>{textVal = val.replace(/[^\d]/g, '')}"
vue input 只允许输入整数、整数和小数(保留小数点后两位)
<el-input size="small" onkeyup="this.value=this.value.match(/\d+\.?\d{0,2}/)" onafterpaste="this.value=this.value.match(/\d+\.?\d{0,2}/)"
v-model="scope.row.agentPrice" maxlength="9"></el-input>
<!--input只允许输入整数-->
<el-input size="small" onkeyup="this.value=this.value.replace(/\D/g,'')" onafterpaste="this.value=this.value.replace(/\D/g,'')"
v-model.number="scope.row.quantityNum" maxlength="9"></el-input>
在vue中下载图片 ——文章适用于下载字符流图片
<div class="link-wrapper" @click="download">下载</div>
download() {
this.getUrlBase64(‘此处传入图片链接’).then(base64 => {
let link = document.createElement('a')
link.href = base64
link.download = 'qrCode.png'
link.click()
})
},
getUrlBase64(url) {
return new Promise(resolve => {
let canvas = document.createElement('canvas')
let ctx = canvas.getContext('2d')
let img = new Image()
img.crossOrigin = 'Anonymous' //允许跨域
img.src = url
img.onload = function() {
canvas.height = 300
canvas.width = 300
ctx.drawImage(img, 0, 0, 300, 300)
let dataURL = canvas.toDataURL('image/png')
canvas = null
resolve(dataURL)
}
})
},