CODEWITHSUNDEEP
javascriptlaravelvue.jsvuejs2vue-component
Geoff_S
Geoff_S

Reputation: 5107

Laravel controller passing value as Vue prop

I currently have a Laravel route leading to the index function of my controller with a passed ID, where I return the id in a view

public function index($id)
{
    return view('progress')
        ->with('identifier', $id);
}

In the component loaded in said view I'm trying to access the identifier as a prop in my vue script

props: ['identifier'],
    methods: {
        getInformation() {
            this.$root.$emit('fetchEvent');
        },
    },
    mounted () {
        console.dir(this.identifier);
    }

However, my console says undefined and I can't figure out how to get the passed identifier as a prop.

What am I doing wrong?

update:

full template code 

<template>
    <div>
        <div class="tab-content">                
                <item-component 
                    :web-identifier="identifier"
                ></item-component>
        </div>
    </div>

</template>


<script>
export default {
   props: ['identifier'],
    methods: {
        getInformation() {
            this.$root.$emit('fetchEvent');
        },
    },
    mounted () {
        console.dir(this.identifier);
    }
}
</script>

blade:

<div>
<task-detail-component></task-detail-component>
</div>

Upvotes: 3

Views: 2142

Answers (2)

Joseph
Joseph

Reputation: 6259

in your template where you need to pass your identifier it will be like this

<div>
<task-detail-component :identifier="{{$identifier}}"></task-detail-component>
</div>

Upvotes: 0

Boussadjra Brahim
Boussadjra Brahim

Reputation: 1

in blade template pass that data as follows :

<div>
<task-detail-component :identifier="{{$identifier}}"></task-detail-component>
</div>

Upvotes: 2

Related Questions