All Components

QRCode Overview

QRCodes take a piece of information from a transitory media and help you generate Canvas and Scalable Vector Graphics (SVG) images which represent QR (Quick Response) codes and can be quickly read by a cell phone.

The QRCode renders all graphics on the client by using Canvas or SVG and supports different conventions for the values and a fallback to VML for older browsers.

The QRCode wrapper for Vue is a client-side wrapper for the Kendo UI QRCode widget.

Basic Usage

The following example demonstrates the QRCode in action.

<div id="vueapp" class="vue-app">
    <kendo-qrcode :value="'geo:42.65049,23.37925,100'"
                  :error-collection="'H'"
                  :size="120"
                  :encoding="'UTF_8'"
                  :color="'#166a83'">
    </kendo-qrcode>
    <kendo-qrcode :value="qrCodeValue" :size="200" :encoding="'UTF_8'"></kendo-qrcode>
    <input v-model="qrCodeValue"/>
</div>
Vue.use(BarcodesInstaller);

new Vue({
    el: "#vueapp",
    data: function() {
        return {
            qrCodeValue: 'Some Text'
        }
    }
})
In this article