时间戳

首页 > 解决方案 > 将数组传递给 Vue 中的 Laravel 视图

arrays - 将数组传递给 Vue 中的 Laravel 视图

问题描述

在 laravel 我有 ProdoctController 和 CategoryController，我用这个函数传递类别数据：

public function view(){
  $category = Category::all();
  return view('admin.product.main',['category'=>$category]);
}

它在 laravel 中以正常模式工作：

<select>
 @foreach(category as categories)
   <option value='{{category->id}}">{{category->name}}</option>
 @endforeach
</select>

但是在 vue js 中，我在数据中有一个类别：[]，我想使用它：

<select v-model="ProductCategory">
<option v-for="category in categories" :value="categories.id">categories.name</option>
</select>

如何传递类别数组中的数据？

标签： arrayslaravelvue.js

解决方案

你可以这样做：

<script type="text/javascript">
    window.data = {!! json_encode([
        'categories' => $categories,
    ]) !!};
</script>

<select v-model="ProductCategory">
    <option v-for="category in window.data.categories" :value="category.id">category.name</option>
</select>

第一部分让您在 JavaScript 中将类别放到视图中，然后 Vue 将可以访问它们。我认为你应该修复你的category/categories变量，如果这是一个你没有正确使用它们的真实代码，例如当你有很多集合而只有一个时。

推荐阅读