vue生成二维码_html生成二维码

vue生成二维码_html生成二维码目录qrcodejs2vue-qrqrcodejs2下载qrcodejs2cnpmi-Sqrcodejs2使用<template><spanref=”qrCodeUrl”></span></template><script>importQRCodefrom”qrcodejs2″;exportdefault{data(){return{};},mo

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全系列IDE稳定放心使用

目录

qrcodejs2

vue-qr


qrcodejs2

下载qrcodejs2

cnpm i -S qrcodejs2

使用

vue生成二维码_html生成二维码vue生成二维码_html生成二维码

<template>
  <span ref="qrCodeUrl"></span>
</template>
<script>
import QRCode from "qrcodejs2";
export default {
  data() {
    return {};
  },
  mounted() {
    this.creatQrCode();
  },
  methods: {
    creatQrCode() {
      let a = new QRCode(this.$refs.qrCodeUrl, {
        text: "hello 大家好", // 需要转换为二维码的内容
        width: 100,
        height: 100,
        colorDark: "black", //#000000为黑色
        colorLight: "white",
      });
      console.log("二维码:", a);
    },
  },
};
</script>

vue-qr

可在二维码中心添加图片

下载:

cnpm i -S vue-qr

使用: 

vue生成二维码_html生成二维码vue生成二维码_html生成二维码

<template>
  <vue-qr
    :logoSrc="imageUrl"
    text="https://blog.csdn.net/qq_40323256/"
    :size="150"
    :margin="0"
    colorDark="black"
    colorLight="white"
  ></vue-qr>
</template>
<script>
import vueQr from "vue-qr";
export default {
  components: {
    vueQr,
  },
  data() {
    return {
      imageUrl: require("@/assets/logo.png"), //欲嵌入至二维码中心的 LOGO 地址
    };
  },
};
</script>

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/186107.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • TS助手 v3.52 视频网站下载工具,网页视频下载神器

    TS助手 v3.52 视频网站下载工具,网页视频下载神器TS的全称则是TransportStream,即传输流,DVD节目中的MPEG2格式,是MPEG2-PS,MPEG2-TS格式的特点就是要求从视频流的任一片段开始都是可以独立解码的,m3u8是一个TS切片列表文件,它记录视频的每个切片的时长与顺序。现主流视频网站都采用这种模式。正因为如此,很多网友遇到这种TS传输流的视频,就有点束手无策了,今天给大家带来的这款TS助手可以轻松帮大家解决视频…

    2022年7月18日
    18
  • 基于arduino的光控窗帘_基于Arduino系统的智能窗帘设计与实现.doc

    基于arduino的光控窗帘_基于Arduino系统的智能窗帘设计与实现.doc摘要:跟随社会发展的潮流,现代科学技术正处于快速发展阶段,人们对智能家居的关注度也越来越高,人们开始寻求更加智能和舒适的生活及办公环境。智能遥控属于电子与信息工程的一个重要分支,在现代智能家居中有着良好的发展前景。本设计采用Arduino单片机来控制智能窗帘系统,实时监测室内温湿度情况并在LCD上显示,使用了红外遥控的技术,可以切换不同的工作模式从而来切换其控制方式,实现半自动控制、自动控制以及远…

    2022年6月23日
    32
  • Mybatis二级缓存_redis二级缓存

    Mybatis二级缓存_redis二级缓存MyBatis深入了解二级缓存

    2022年9月21日
    3
  • 软件工程系统设计说明书(软件详细设计说明书模板)

    1引言1.1编写目的该文档在概要设计的基础上,进一步的细化系统结构,展示了软件结构的图标,物理设计、数据结构设计、及算法设计、详细的介绍了系统各个模块是如何实现的,包括涉及到的算法,逻辑流程等。预期的读者:程序员1.2背景a. 待开发软件系统的名称:机房收费系统b. 项目的任务提出者:米新江教授c. 项目的开发者:齐智d. 项目的用户:廊坊师范学院全体在职员工及学生e. 运行该软…

    2022年4月12日
    129
  • js中的闭包[通俗易懂]

    js中的闭包[通俗易懂]闭包是js的一个难点也是它的一个特色,是我们必须掌握的js高级特性,那么什么是闭包呢?它又有什么用呢?我们都知道,js的作用域分两种,全局和局部,基于我们所熟悉的作用域链相关知识,我们知道在js作用域环境中访问变量的权利是由内向外的,内部作用域可以获得当前作用域下的变量并且可以获得当前包含当前作用域的外层作用域下的变量,反之则不能,也就是说在外层作用域下无法获取内层作用域下的变量,同样在不同的函…

    2022年6月25日
    26
  • c# dynamic用法_dynamic_cast详解

    c# dynamic用法_dynamic_cast详解dynamic是FrameWork4.0的新特性。dynamic的出现让C#具有了弱语言类型的特性。编译器在编译的时候不再对类型进行检查,编译期默认dynamic对象支持你想要的任何特性。比如,即使你

    2022年8月4日
    6

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号