laravel窗體模型綁定和vuejs

我有一個問題，而從數據與我的模型綁定。當我加載用於編輯資源的編輯頁面時，我可以在輸入中看到輸入值，但是它自綁定到vuejs後儘快消失。laravel窗體模型綁定和vuejs

這裏是我的vuejs數據

data: { 
     form: new Form({ 
      title: '', 
      language: [], 
      poster: '' 
     }) 
    },

和我的輸入是這樣的

{!! Form::model($movie, ['class' => 'form-horizontal', '@submit.prevent' => 'form.updateMovie', 'id' => 'update-movie-form', 'files' => true, '@keydown' => 'form.errors.clear($event.target.name)']) !!} 
.... 
{!! Form::text('title', 'movie title', ['class' => 'form-control', 'id' => 'title', 'v-model' => 'form.title']) !!} 
.... 
{!! Form::close() !!}

我怎樣才能解決這個問題呢？

來源

2017-07-14 Adam nick

您的vue代碼是刀片文件還是js文件？如果你使用webpack編譯一個js文件？ –

@RossWilson它在js文件中。 –

是的，使用webpack編譯它 –

今天我的問題完全一樣。

Vue.js版本1允許我們通過value屬性爲v-model提供初始值，但在2.0版本上已棄用此功能。

遷移指南說：

v-model不再關心內嵌值屬性的初始值。爲了可預測性，它總是將Vue實例數據視爲真相的來源。

信貸，信貸是由於：https://www.npmjs.com/package/vue-data-scooper

該插件（和報價）的作者標識Vue.js的變化，並寫下了vue-data-scooper插件作爲一個變通（恢復原功能）。

我現在正在使用插件（按照上面的鏈接上的說明），並可以確認它「解決」您遇到的問題。

我不想複製插件的文檔中找到現有的指示，但我沒有發現他們與我所用的Laravel安裝（V5.4）精確地對準。

具體來說，我安裝了插件...

npm install vue-data-scooper

...然後打補丁我app.js（這是在我的情況極小的）...

require('./bootstrap'); 

window.Vue = require('vue'); 
import VueDataScooper from "vue-data-scooper" 
Vue.use(VueDataScooper);

...和下降來自我的new Vue(...)聲明的data: {...}聲明（允許插件使用初始數據對其進行排序）。

來源

2017-07-14 13:55:34 wally

添加了一個非常簡單的javascript-light和「隨船「Laravel 5.4安裝。我是一個AngularJS傢伙，而不是Vue--所以我的「整合」可能不太理想...... – wally

laravel窗體模型綁定和vuejs

回答

相關問題