2016-10-10 4 views
0

Ich versuche vue-Multiselect (Version 1.1.3) mit Laravel 5.Laravel vue-Multiselect-Fehler

In meiner vue Datei Ich habe diesen Code zu implementieren:

<template> 
    <div class="dropdown"> 
     <multiselect 
       :seleted="multiValue" 
       :show-labels="false" 
       :options="options" 
       :placeholder="placeholder" 
       :searchable="true" 
       :allow-empty="false" 
       :multiple="true" 
       key="name" 
       label="name" 
       @update="updateSelected" 
     ></multiselect> 
     <label v-show="showLabel" for="multiselect"><span></span>Language</label> 
    </div> 
</template> 

<script> 
    import { Multiselect } from 'vue-multiselect'; 

    export default { 
     components: { Multiselect }, 
     props: { 
       selected: null, 
       options: { 
        type: Array, default: function() { 
         return [] 
        } 
       }, 
       placeholder: 'Select...' 
     }, 
     methods: { 
      updateSelected (newSelected) { 
       this.selected = newSelected 
      } 
     } 
    } 
</script> 

In meiner Klinge Datei :

<div class="form-group"> 
       <drop-down 
         :options="{{ $members_list->toJson() }}" 
       ></drop-down> 
      </div> 

In meinem Controller:

$members = DB::table('members') 
      ->orderBy('member_first_name', 'asc') 
      ->get(); 

     $members_list = $members->map(
      function($member) { 
       return [ 
        "value" => $member->member_id, 
        "label" => $member->member_first_name. " ". $member->member_last_name 
       ]; 
      } 
     ); 

Wenn ich die Seite ausführe, erhalte ich eine Auswahlliste mit allen Mitgliedern, aber wenn ich versuche, eine auszuwählen, wird sie rot, sie wird zur oben ausgewählten Liste hinzugefügt, aber ich kann keine weiteren Optionen auswählen und bekomme einen Firebug Dieser Fehler: [Vue warn]: Sie legen einen nicht vorhandenen Pfad "ausgewählt" auf einer VM-Instanz fest. Erwägen Sie die Vorinitialisierung der Eigenschaft mit der Option "data" für eine zuverlässigere Reaktivität und bessere Leistung.

Was fehlt mir?

Antwort

0

Tippfehler können Probleme verursachen?

:seleted="multiValue" 

sollte sein: selected = "MultiValue-"

BTW: ausgewählt ist in der Version 2.0 als veraltet. : Wert hat seinen Platz eingenommen.

0

Ich denke, es ist, weil es keine Variable namens "multiValue" in Ihrer Komponente gibt. In : seleted = "MultiValue-", die Variable "Optionen" statt "MultiValue-"