How can I add condition on vue component that is loaded from the view blade laravel?

Question

My view blade laravel like this :

@extends(\'layouts.app\')
@section(\'content\')
    ...
        
    ...
@endsectio         


        

Answer 1

You are mixing of instantiation of Vue components and Bootstrap's modals event triggered.

What you can do is using Bootstrap modal events. Example code below:

<template>
    <div id="modal-transaction" class="modal fade" tabindex="-1" role="dialog">
        ...
    </div>
</template>
<script>
    export default {
        methods: {
            onModalOpen() {
                // Do something when modal opens
            },
            onModalClose() {
                // Do something when modal closed
            }
        },
        mounted() {
            $('#modal-transaction').on('shown.bs.modal', this.onModalOpen.bind(this))
            $('#modal-transaction').on('hidden.bs.modal', this.onModalClose.bind(this))
        }
    }
</script>