gruhn / vue-qrcode-reader

A set of Vue.js components for detecting and decoding QR codes.
https://gruhn.github.io/vue-qrcode-reader
MIT License
2.03k stars 330 forks source link

OnInit() not called #352

Closed visualight closed 11 months ago

visualight commented 11 months ago

The OnInit() method is not called and I can't figure out why.

The console.log gives me nothing at all Any ideas for a solution?

<template>
    <div class="instascan" ref="instascan">
        <qrcode-stream @init="onInit" ref="qrcodeStream">
            <div class="loading-indicator" v-if="loading">Loading...</div>
            <div class="actions" v-if="!loading">
                <button class="btn">Validation manuelle</button>
            </div>
        </qrcode-stream>
    </div>
</template>

<script>
import { QrcodeStream } from 'vue-qrcode-reader'

export default {
    components: { QrcodeStream },

    data() {
        return{
            loading: false,
        }
    },
    mounted() {
        this.$nextTick(() => {
            this.checkScreenSize();
        });
    },
    methods: {
        async onInit(promise) {
            this.loading = true;
            console.log('INIT');

            /*try {
                await promise
            } catch (error) {
                console.error(error)
            } finally {
                this.loading = false
            }*/
        },
        checkScreenSize() {
            const videoElement = this.$refs.qrcodeStream.$el.querySelector('video');
            if (videoElement) {
                videoElement.style.height = window.innerHeight + 'px';
            }
        },
    }
}
</script>
"devDependencies": {
        "axios": "^1.4.0",
        "cross-env": "^7.0",
        "laravel-mix": "^6.0.49",
        "lodash": "^4.17.19",
        "resolve-url-loader": "^3.1.0",
        "sass": "^1.15.2",
        "sass-loader": "^13.3.2",
        "vue": "^3.3.4",
        "vue-loader": "^16.8.3",
        "vue-template-compiler": "^2.7.14"
    },
    "dependencies": {
        "moment": "^2.29.4",
        "moment-locale-fr": "^1.0.0",
        "vue-qrcode-reader": "^5.1.0",
        "vue-router": "^4.2.4",
        "vue-sweetalert2": "^5.0.5"
    }