How to display a QR code with logo (or only QR code)

Get Help
1

I want to display the QR code containing the device id so that user can directly pair with the device without manually entering the device id. Also QR code will be displayed in order to download the app from play store or ios store.

2

First of all, for the pairing part your backend should support such a feature providing either an URL you’ll embed into the QR code or the QR code image itself.
If you need to generate a QR code on the client side you may use the qrcode package.
Here is an example of integration with Lightning:

import qrcode from 'qrcode'

export class QRCode extends Lightning.Component {
  static _template {
    return { w: 300, h: 300 }
  }

  _active() {
    qrcode
      .toDataURL('http://my.pairing?code=12345', { width: 300 })
      .then(image => {
        this.src = image
      })
  }
}

Of course, you need to add some logic to retrieve the URL, display loading indicators and handle possible errors.