anthonylee83 / vue-qrcode-component

Create QR codes with a simple Vue component
https://gerardreches.github.io/vue-qrcode-component/
MIT License
0 stars 3 forks source link

When I pass url string to text prop, it complaints that it's Boolean #4

Closed tesicg closed 2 years ago

tesicg commented 3 years ago

Hi!

I'm trying to use your component to generate QR Code from url in the following way:

<qr-code 
    v-if="qrCodeUrl"
    :text="qrCodeUrl"
/>

data() {
    return {
        qrCodeUrl: '',
        ...
}

getQrCodeUrl(paymentId) {
    this.$axios.get(`${this.$config.server}/api/crm/payments/qr/${paymentId}/url`)
    .then(responseUrl => {
        this.qrCodeUrl = responseUrl.data.data.url
        ...
}

qrCodeUrl is ordinary url (string) and your component generates QR code image, but there's an error in console:

[Vue warn]: Invalid prop: type check failed for prop "text". Expected String, got Boolean with value true.

found in

`
---> <QrCode> at node_modules/vue-qr-generator/src/QRCode.vue
       <VCard>
         <ThemeProvider>
           <VDialog>
             <Wrapper> at src/layouts/Wrapper/Wrapper.vue
               <OrdersView> at src/pages/Finance/Orders/OrdersView.vue
                 <VContent>
                   <Main> at src/layouts/Main/Main.vue
                     <VApp>
                       <App> at src/components/App/App.vue
                         <Root>

And really Vue DevTools displays qrCodeUrl with value: true. There's no url string.

I'm not sure what's going on and how to get rid of this error.