CODEWITHSUNDEEP
laravelvue.js
Brad_Fresh
Brad_Fresh

Reputation: 119

How to pass data to vue

In ExampleComponent I listen to event and I receive user's IP. Then I would like to display data in a vue. But how can I pass this data(variable $ip)? I mean instead of just console.log it, I should bring data to my page(console.log works). 

<script>
export default {
    data: function() {
        return {
   ip:''
},
     mounted() {
        window.Echo.channel('channelName')
            .listen('eventIp', (e) => {
              this.ip=e
            })
        }
     }
</script>

As for ExampleComponent it's built to my admin page where I listen for events.

It is just a line < example-component>

Upvotes: 0

Views: 87

Answers (1)

Hamid Shariati
Hamid Shariati

Reputation: 599

add data section in your script like this:

<script>
export default {
data(){
   return{
     ip:''
   }
},

before script and inside template tag add a div,p,h1,span, etc. to show ip variable.

<template>
.
.
.
<div v-html="ip"></div>
.
.
.
</template>

then change ip variable when you receive channel info:

    mounted() {
        window.Echo.channel('channelName')
            .listen('eventIp', (e) => {
                this.ip=e
            })
   }
}

automatically the value of change to ip value.

Upvotes: 1

Related Questions