Link 到参数为 Vue.js 的路由

Question

我正在使用 Vue.js 和 Laravel 呈现简单的 table 列表产品。从那里我想 link 到这样的产品详细信息页面：

<a href="{{ route("product::details", ['product' => '???']) }}">@{{ product.id }}</a>

由于 table 是在客户端基于数据对象生成的，我正在寻找最优雅的实现方式，同时不绕过任何 laravel 方法，如 route() 允许我 link 到命名路线。

我真的必须手动将路由方法的结果与 Javascript 中的 Vue 变量合并吗？

在我看来是这样的：

<a href="{{ route("product::details", ['product' => ':product.id']) }}">@{{ product.id }}</a>

我可以通过 Vue 通过数据绑定 parse/inject？

Answer 1

作为 Vue，它是客户端，laravel它是服务器端，你无法用那种方式完成。

但是你可以在渲染的路线上做这样的事情：

创建一个vue方法

goto_route: function (param1) {
     route = '{{ route("yournamedroute", ["yourparameter" => "?anytagtoreplace?"]) }}'
     location.href = route.replace('?anytagtoreplace?', param1)
}

现在在您的操作元素中

<div v-for="o in object">
     <a v-on:click="goto_route(o.id_key)">press</a>
</div>

基本上，您是在用所需的值替换...嗯...让我们在呈现的路线中将其命名为“placehoder”。

希望对您有所帮助。

Link 到参数为 Vue.js 的路由

Link to a route with a parameter of Vue.js

php

laravel

vue.js

laravel-5