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)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • CListCtrl 扩展风格设置方法—SetExtendedStyle和ModifyStyleEx

    CListCtrl 扩展风格设置方法—SetExtendedStyle和ModifyStyleEx想把ListCtr设置为整行高亮显示错误的方法为:1clistctrl.ModifyStyleEx(0,LVS_EX_FULLROWSELECT|LVS_EX_GRIDLINES);正确的方法为:1DWORDdwStyle=clistctrl.GetExtendedStyle();2dwStyle|=LVS_EX_FULLROWSELECT|L…

    2022年7月19日
  • StrictMode使用

    StrictMode使用【IT168技术】最新的Android平台中(Android2.3起),新增加了一个新的类,叫StrictMode(android.os.StrictMode)。这个类可以用来帮助开发者改进他们编写的应用,并且提供了各种的策略,这些策略能随时检查和报告开发者开发应用中存在的问题,比如可以监视那些本不应该在主线程中完成的工作或者其他的一些不规范和不好的代码。  StrictMode有多种不

    2022年6月10日
  • html的标签点击触发js函数的四种方法[通俗易懂]

    html的标签点击触发js函数的四种方法[通俗易懂] 方法1&lt;a href="" onclick="funct()"&gt;我是a标签&lt;/a&gt;方法2&lt;a href="javascript:funct()"&gt;我是a标签&lt;/a&gt;方法3&lt;a id=’funct’ &gt;我是a标签&lt;/a&gt; 方法4然后使用jq的方法

    2022年6月13日
  • 直播ios 版_第三方pptp客户端ios

    直播ios 版_第三方pptp客户端ios当前视频直播非常火爆,手机端的视频直播也非常火爆,PGC、UGC的视频直播门槛都降低了很多。本文介绍一个:IOS客户端直播的SDK,代码完全开源。直播时代:让IOS普通开发者一天内做出一个R

    2022年8月5日
  • Java MD5 加密工具类[通俗易懂]

    Java MD5 加密工具类[通俗易懂]一、MD5简介MD5消息摘要算法(英语:MD5Message-DigestAlgorithm),一种被广泛使用的密码散列函数,可以产生出一个128位(16字节)的散列值(hashvalue),用于确保信息传输完整一致。MD5算法是不可逆的。MD5由美国密码学家罗纳德·李维斯特(RonaldLinnRivest)设计,于1992…

    2022年7月16日
  • 合宙Air720U&724U&722U Lua 固件更新说明

    合宙Air720U&724U&722U Lua 固件更新说明Lua固件更新说明如下:首推1.3基线,不支持1.2基线空中升级到1.3基线版本目录名称1.3底层core下载地址1.2底层core下载地址上层软件下载地址1.3底层core固件更新说明1.2底层core固件更新说明上层脚本更新说明空间说明Luat二次开发使用的Flash空间有两部分:脚本区和文件系统区脚本区:通过Luatools烧写的所有文件,都存放在此区域非TTS版本为720KB,TTS版本为426KB;如果烧录时,超过此限制,Luatools会报错不同版本的core可能会有差异,以

    2022年7月20日

发表回复

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

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