在vue文件中写个获取本地时间的代码,谢谢大佬们了,百度了好久,还是没搞出来
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了在vue文件中写个获取本地时间的代码,谢谢大佬们了,百度了好久,还是没搞出来相关的知识,希望对你有一定的参考价值。
参考技术A let now = new Date(); //获取当前时间 参考技术B 之间获取当前时间不行?vue+Qrcode实现动态生成二维码(图片格式,点击下载可保存本地)
1.首先安装插件依赖
npm install qrcodejs2 --save-dev 或者 yarn add qrcodejs2 --save-dev
2.安装完成之后在项目中引入
import QRCode from 'qrcodejs2'
3.然后再页面中写个标签用来渲染他
<template>
<div id="qrcode" ref="qrcode" @click="download"></div>
//img标签会导致二维码渲染不到页面上,所以此处用了div
</template>
4.methods中写入函数
showQrcode() {
document.getElementById("qrcode").innerHTML = "";
var qrcode = new QRCode('qrcode', { // 第一个参数是组件的id值
text: '我是这个二维码的文本内容', // 生成二维码的文本
width: 300,
height: 300,
colorDark: '#000000', // 二维码色
colorLight: '#ffffff', // 二维码背景色
correctLevel: QRCode.CorrectLevel.H // 容错等级
})
},
5.在mounted中调用此方法
this.$nextTick (function () {
this.showQrcode();
})
6.最后在methods中写入一个下载事件
// 点击下载app二维码
download() {
var canvasData = this.$refs.qrcode.getElementsByTagName('canvas')
var a = document.createElement("a");
var event = new MouseEvent("click"); // 创建一个单击事件
a.href = canvasData[0].toDataURL("image/png");;
a.download = "drcQrcode";
a.dispatchEvent(event); // 触发a的单击事件
},
以上是关于在vue文件中写个获取本地时间的代码,谢谢大佬们了,百度了好久,还是没搞出来的主要内容,如果未能解决你的问题,请参考以下文章