使用 Vuejs 填充特定输入 - 来自数据库的 Laravel

Posted 2023-05-07

【中文标题】使用 Vuejs 填充特定输入 - 来自数据库的 Laravel

【英文标题】：Populate specific input with Vuejs - Laravel from database

【发布时间】：2016-08-11 10:45:46

【问题描述】：

请帮忙，抱歉，我是 Vuejs 新手，可能有一个简单的问题：

如何在其他输入标签上搜索数据和填充单个查询

如何将 Vue 与 select2 插件结合使用（与 select2 结合后 Vue 不起作用） 这是我的代码：

填充.js

new Vue(

  el: '#penerima',

  data: 
    namapenerima : '',
  ,

  computed: 
    website() 

      var url = "/campaign/create1/" + this.namapenerima;

      this.$http.get(url, function(response)
        return response.website;
      );

      return this.namapenerima;
      // return response.website
    
  

);

路线：

Route::get('/create1/namapenerima', function($namapenerima)
        return App\Donee::where('id', $namapenerima)->first();
    );

刀片：

                            <div id="penerima">
                              <li>
                                <label>Nama Penerima * </label>
                                <div class="fields-area">
                                  <div class="field-col col-md-12">
                                    <select id="namapenerima" name="namapenerima" v-model="namapenerima" class="form-control">
                                      @foreach ($donee as $d)
                                        <option value=" $d->id ">  $d->donee_name  </option>
                                      @endforeach
                                    </select>
                                  </div>
                                </div>
                              </li>
                              <li>
                                <label>Website</label>
                                <div class="fields-area">
                                  <div class="field-col col-md-12">
                                    <input type="text" v-model="website">
                                    <span class="char-remain">  </span>
                                  </div>
                                </div>
                              </li>
                            </div>

Select2 脚本：

$('#namapenerima').select2(
    allowClear: "true",
    placeholder: 'Pilih nama penerima donasi').on('select2-opening', function()
    
        $(this).closest('li');
    );

它在网站输入字段中返回 id 号，我知道缺少某些东西但不知道它是什么

提前谢谢你。

【参考方案1】：

你需要创建一个指令来控制 vuejs 中的另一个库。

这是一个例子： https://vuejs.org/examples/select2.html

还有你的选择

<select class="form-control" 
    v-model="namapenerima"
>
    <option v-repeat="d in donee" value="@ exam.d ">@ d.donee_name <option>
</select>

【参考方案2】：

如果您来到这里只是想用一些不会用作输入值的文本来填充输入字段，那么在 HTML5 中您可以使用：

placeholder='some text'