Laravel 控制器将值作为 Vue prop 传递

Question

我目前有一条 Laravel 路线通往我的控制器的 index 函数，我在其中传递了一个 ID return 视图中的 id

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

在上述视图中加载的组件中，我正在尝试访问 identifier 作为我的 vue 脚本中的道具

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

但是，我的控制台显示未定义，我无法弄清楚如何将传递的 identifier 作为 prop。

我做错了什么？

更新：

完整模板代码

<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>

Answer 1

在您需要传递 identifier 的模板中，它会像这样

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

Answer 2

在 blade 模板中按如下方式传递该数据：

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

Laravel 控制器将值作为 Vue prop 传递

Laravel controller passing value as Vue prop

javascript

laravel

vue.js

vue-component

vuejs2