laravel - 使用 Laravel old 和 Vue.js 的更好方法

Question

我正在使用 vue.js 2.0 和 Laravel 5.4 我想知道是否有更好的方法来发送数据 Controllers -> views without lost the value, overwrite by the v-model

因为在对 vue.js 充电之后，这会获取以这种方式定义的数据中的值

data: {
    ciudad:'',
}

如果我尝试做那样的事情

 <input  class="form-control"  id="ciudad" name="ciudad" type="text"  v-model="documento.ciudad"  value="{{ $documento->ciudad }}" >

我丢失了 Controller 发送的值

Answer 1

Vue 确实希望您从 View 模型初始化数据，然后更新 View ，但是，您希望使用 View 中的数据来更新底层模型数据。

我认为最简单的方法是编写一个从 HTML 初始化值的指令，这样您就不需要直接访问 DOM:

Vue.directive('init', {
  bind: function(el, binding, vnode) {
    vnode.context[binding.arg] = binding.value;
  }
});

有点抽象所以值得一看Directive Hook Arguments文档部分。

这可以像这样使用:

<input v-model="ciudad" v-init:ciudad="'{{ old('ciudad') }}'">

这是 JSFiddle:https://jsfiddle.net/v5djagta/