[Vuejs]-I want to integrate a laravel broadcast to update an html attribute in realtime

by

0👍

✅

:data-value="value" is basically saying that the attribute data-value should be set to whatever value is in your data object.

To update the property value you just need to do 

this.value = 'the new value of the property';

i.e.

created() {
    Echo.channel('progress-bar-socket')
        .listen('ProgressUpdaterEvent', (e) => {
            this.value = e["update"];
        });
},

I would recommend you have a look at The series of tutorials

The value for the progress bar won’t automatically update when the attribute changes. Looking at the docs, to update the value you can use:

 $('#grantprogress').progress('set progress', this.value);

So, you can either set up a water for value or just put this directly your listener callback:

Echo.channel('progress-bar-socket')
.listen('ProgressUpdaterEvent', e => {
    $('#grantprogress').progress('set progress', e.update);
});

Leave a comment