upccrt/resources/js/components/credential.vue

<template>
<div>
    <p class="h6">{{this.data.creddesc}}</p>
    <label for="username"><i class="fas fa-user"></i></label>
    <input type="text" id="username" v-bind:value=this.data.creduser readonly/>
    <label for="password"><i class="fas fa-key"></i></label>
    <input type="text" id="password" v-bind:value=this.data.credpass readonly/>
</div>
</template>
<script>
export default {
    props: ['credential'],
    data() {
        return {
            data: JSON.parse(this.credential)
        }
    },
    mounted() {
        Echo.channel('credentials')
            .listen('CredentialUpdated', (e) => {
                this.data = JSON.parse(e.data);
            });
    }
}
</script>