laravel vue.js 从数据库中选择列表答案

【问题标题】：laravel vue.js select list from databaselaravel vue.js 从数据库中选择列表
【发布时间】：2018-02-06 14:32:43
【问题描述】：

我刚开始使用 Vue.js，但遇到了一些问题：

我目前正在使用 Laravel，一个 PHP 框架。

我想做一个研究的选择列表，我有不同的应用程序，但都与不同的国家有关。当我选择一个国家/地区时，我希望只显示具有该国家/地区的应用程序。

我以前用过php，但是每次都要重新加载页面，用起来不是很快捷。

我的主页是这样的：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title>VueJS</title>
  <link rel="stylesheet" href="">
  <script src="/js/vue.js"></script>
 </head>
<body>
     <div id="app">
    <div id="country">
     <select v-model="selectedcountry">
     <option v-for="option in options" v-bind:value="option.value">@{{ option.text }}
        </option>
     </select>
    <span>Sélectionné : @{{ selectedcountry }}</span>
 </div>
  <script src="/js/app.js"></script>
 </body>
 </html>'

还有我的 app.js：

new Vue({
   el: '#country',
   data: {
    selectedcountry: 'All Countries',
      options: [
      { text: 'All Countries', value: 'world' },
      { text: 'Denmark', value: 'denmark' },
      { text: 'France', value: 'france' },
    ]
  }
})'

在我的数据库中，我的表是：“卡片”，属性名为“国家”。

我的控制器是：

<?php

namespace App\Http\Controllers;

use App\Apps;
use Illuminate\Http\Request;

class SearchController extends Controller
{
    public function search(Request $request)
    {
        if ($request->has('Country')) {
            $apps = Apps::where('Country', $request->Country)->get();

            return view('index', compact('apps'));
        }
    }
}

我该怎么做？

【问题讨论】：

你怎么能做什么？
我想做一个选择列表进行研究，我有不同的应用程序，但都与不同的国家有关。当我选择一个国家/地区时，我希望只显示具有该国家/地区的应用程序。
...一旦用户选择了一个国家，就向该国家发出 ajax 请求，根据国家/地区查询应用程序，返回结果，然后循环显示它们。
好的，但我不明白如何使用它。在使用 vue.js 之前，我是这样做的：。但它每次都会重新加载页面。那么使用 Ajax 就可以了？
基本上，是的。我建议看看laracasts.com/series/learn-vue-2-step-by-step

标签： javascript php laravel vue.js

【解决方案1】：

我的控制器是：

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use App\Apps;
 class SearchController extends Controller
{
  public function search(Request $request){
   if( $request->has('Country') ){
     $apps = Apps::where('Country',$request->Country)->get();
     return view('index',compact('apps'));      
   }        
  }
 }

【讨论】：

【解决方案2】：

您必须为您的应用程序创建 vue 组件。使用组件可以使您的代码更简单且结构良好，同时您也会对 #country 和 #app 感到困惑，并且您还需要为 vue 定义表单元素。

【讨论】：