链接转化为二维码

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
</head>

<body>
    <div id="app">
       {{message}}
       <button @click="showCode('all')">点我啊</button>
       <div id="insertCode"></div>
    </div>
</body>

<script src="./node_modules/vue/dist/vue.js"></script>
<script src="./jquery.min.js"></script>
<script src="./qrcode.js"></script>
<script src="./qrcode.min.js"></script>
<script>
</script>
<script>
    var app = new Vue({
        el: '#app',
        // str:'',
        data: {
            message: 'Hello Vue!',
            str:'',
            qrcode:''
        },
        methods: {
           showCode:function (item){
                if (item == 'all') {
                    this.geturl('https://try.fishqc.com')
                }
           },
            //得到url
            geturl: function (url) {
                
                this.str = url;
                this.qrcode.makeCode(this.str);
            },
            getGood:function () {
                this.qrcode=new QRCode(document.getElementById("insertCode"), {
                     120,
                    height: 120
                });
            }
    
        },
        mounted: function() {
            this.getGood()   
        }
    })
</script>

</html>

这里要注意的是必须要在mounted里面去调用,因为qrcodejs应该是操作dom的，所以需要dom树完全渲染出来才调用,见附件

相关阅读:
简单的javascript抽奖程序
Linux 二层协议架构组织
常用正则表达式总结
很好的矩阵覆盖问题
很好的求幂的题目
不错的题目-n个数连接得到的最大值
netstat命令介绍-要用熟
一次完整的http事务
Apache vs. Nginx
Python学习-生成器

原文地址：https://www.cnblogs.com/antyhouse/p/9198348.html