使用 laravel 和 vue js 从 mysql 数据库中检查带有逗号分隔值的复选框

Question

我正在尝试使用来自 Laravel vue js 中的数据库的值检查复选框。我已经以值分隔格式将所选项目添加到数据库中。现在我想通过将添加的值绑定到适当的复选框来编辑它们。

这是部分代码

            SelectRestaurant:function(id)
                   {

                        var _this = this;
                        this.RestaurantObject.id =  id;
                        var input = this.RestaurantObject;
                        axios.post('getRestaurant', input).then(function(response){
                        _this.RestaurantObject = response.data;


                    }).catch(function(error){
                        alert('Could not load record. Please try again');

                    })

                 },

<label>Select Restaurant Types</label>
        <!--<select name="type_id" id="type_id" class="form-control text-small" v-model='form.type_id' multiple>
                                            <option value="0" selected="" disabled="">Select Restaurant Types</option>
                        <option v-for='t in types' :value='t.id'>@{{ t.type_name }}</option>
                                            </select>-->




                                          <ul>
        <li v-for="t in types" style="display: inline-block; list-style:none; padding:7px">
          <input type="checkbox" :value="t.id" v-model="RestaurantObject.type_id">

          <label :for="t.id">@{{ t.type_name }}</label>
        </li>



   </ul>


Vue js codes

<!-- begin snippet: js hide: false console: true babel: false -->

Answer 1

您可以尝试提供您的 Vuejs 数据对象吗？同时，你可以做

<li v-for="t in types" style="display: inline-block; list-style:none; padding:7px">
  <input type="checkbox" :value="t.id" v-model="RestaurantObject.type_id" :checked="types.includes('RestaurantObject.type_id')">
  <label :for="t.id">@{{ t.type_name }}</label>
</li>