选择使用Laravel在vue js中选择的下拉列表当前无法正常工作

Question

嗨，我有这个选择下拉列表，将在编辑页面上选择。现在我的问题是我已经有了代码，但似乎无法正常工作。这是下面的代码。

<div id="app-accomodation-type-private">
                    <select name="accomodationType" id="form_type" data-style="btn-selectpicker" title="" aria-describedby="propertyTypeHelp" class="selectpicker form-control">
                      <option value="0">Please Select</option>
                      <optgroup v-for="(group, name) in optionGroups" :label="name">
                          <option v-for="option in group" :value="option.value" :selected="option.value =={{ json_encode($postRoom['accomodation_type']) }}?true : false">
                            @{{ option.text }}
                          </option>
                        </optgroup>
                    </select>
                </div>

现在我的vue js脚本

<script>
    //accomodation type private room
    new Vue({
    el: '#app-accomodation-type-private',
        data: {
          //selected: 'A',
          optionGroups: {
            PrivateRoom: [
              { text: 'Single Bed', value: 'Single Bed' },
              { text: 'Double Bed', value: 'Double Bed' },
              { text: 'Queen Size Bed', value: 'Queen Size Bed' },
              { text: 'Barkada', value: 'Barkada' }
            ],
            Tent: [
              { text: 'Tent', value: 'Tent' },
              { text: 'Hammock', value: 'Hammock' }
            ]
          }
        }
    })



</script>

现在看来是什么问题？有人可以帮我解决这个问题吗？ TIA