如何将刀片数组中的路由数组传递给 Laravel 中的 Vue 组件答案

【问题标题】：How to pass an array of routes from blade.php to a Vue component in Laravel如何将刀片数组中的路由数组传递给 Laravel 中的 Vue 组件
【发布时间】：2021-01-21 16:40:30
【问题描述】：

我有一个控制器将路由传递给一个blade.php 文件。在那个blade.php 文件中，我使用了一个Vue 组件并将:routes 作为道具传递给Vue 组件。问题是，控制器正在返回多个路由的集合，但是当我将 :routes 传递给我的 Vue 组件时，它会出错，除非我一次只通过一个路由。在我的组件中，我有路由被接受为props 中的数组。如何将一组路由从刀片传递到 vue？

blade.php 文件

  <user-exam
        :routes="{{ json_encode( route('user.exam-start', ['exam' => $exam[0]]))}}"
  ></user-exam>

正如您在上面的代码中看到的，我使用[0] 索引来传递一条路线，我不想这样做。

userExam.vue 文件

<script>

export default {
  props: {
    routes: Array,
  },
}
</script>

谢谢。

【问题讨论】：

标签： php laravel vue.js

【解决方案1】：

我对 Laravel 毫无用处，但听起来你想将 $exam 数组映射到路由数组（由 route 函数返回）。

试试这个

<user-exam
  :routes="{{ json_encode( array_map(function($ex) {
    return route('user.exam-start', ['exam' => $ex]);
  }, $exam) ) }}"
></user-exam>

【讨论】：

这很有帮助，问题是我的 array_map() 方法的第二个参数是一个对象而不是一个数组，所以它不能按预期工作。
这没有意义。在您上面的问题中，您使用 $exam[0] 这表明 $exam 显然是一个数组
这是一个雄辩的集合中的数组
不，仍然没有意义

【解决方案2】：

我找到了解决问题的方法，我最终像这样在刀片文件中循环

@foreach($exam as $ex)
<user-exam
        :routes="{{ json_encode( route('user.exam-start', ['exam' => $ex]))}}"
  ></user-exam>
@endforeach

这最终会创建 vue 组件的多个实例，但它可以按我的意愿工作。

在 vue 开发工具中你有类似的东西：

<Root>
    <userExam>
    <userExam>
</Root>

【讨论】：