demo 原始链接:https://vux.li/demos/v2/#/component/qrcode
\n下面的$t是Demo的i18n使用的翻译函数,一般情况下可以直接使用字符串。另外,下面代码隐藏了i18n标签部分的代码。
\n<template>\n <div style=\"text-align:center;margin-top:15px;\">\n <divider>{{ $t('default type = img') }}</divider>\n <qrcode value=\"https://vux.li?x-page=demo_qrcode\" type=\"img\"></qrcode>\n <br>\n <br>\n <divider>{{ $t('type = canvas') }}</divider>\n <qrcode value=\"https://vux.li?x-page=demo_qrcode\"></qrcode>\n <br>\n <qrcode :value=\"value\" :fg-color=\"fgColor\"></qrcode>\n <br>\n <span>{{ $t('current url') }}: {{value}}</span>\n <br>\n <span>{{ $t('current fgColor') }}: {{fgColor}}</span>\n </div>\n</template>\n\n\n\n<script>\nimport { Qrcode, Divider } from 'vux'\n\nexport default {\n mounted () {\n setInterval(() => {\n this.value = `https://vux.li?t=${Math.random()}`\n this.fgColor = `#${Math.floor(Math.random() * 16777215).toString(16)}`\n }, 1000)\n },\n components: {\n Qrcode,\n Divider\n },\n data () {\n return {\n value: 'https://vux.li',\n fgColor: '#000000'\n }\n }\n}\n</script>\n
\n