V-模型在选择2中不起作用。我不知道我该如何解决。当我删除 Select2 的类 V 模型工作时

Question

当用户选择某个值时，我必须隐藏一些输入。我不能得到"advertisement_type"的值，但我必须得到这个值。在这种情况下你能帮我吗？

select2和jquert-js之后我添加了vuejs文件。当我删除select2类时，v-model就起作用了。

我必须使用select2和vue。

提前谢谢。

<div class="kt-section kt-section--first">
<label>İlan Türü :</label>
<select v-model="advertisement_type" class="form-control kt-select2" id="kt_select2_2" name="advertisement_type">
<optgroup label="Arsa">
<option value="land">Arsa</option>
</optgroup>
<optgroup label="Konut">
<option value="apartment">Daire</option>
<option value="residence">Residence</option>
<option value="detached-house">Müstakil Ev</option>
<option value="villa">Villa</option>
<option value="farm-house">Çiftlik Evi</option>
<option value="pavilion">Köşk</option>
<option value="waterside">Yalı</option>
<option value="waterside-apartment">Yalı Dairesi</option>
<option value="summery">Yazlık</option>
<option value="prefabricated-house">Prefabrik Ev</option>
<option value="cooperative">Kooperatif</option>
</optgroup>
<optgroup label="İş Yeri">
<option value="">İş Yeri</option>
<option value="akaryakit-istasyonu"> Akaryakıt İstasyonu</option>
<option value="apartman-dairesi"> Apartman Dairesi</option>
<option value="atolye"> Atölye</option>
<option value="avm"> AVM</option>
<option value="bufe"> Büfe</option>
<option value="buro-ofis"> Büro &amp; Ofis</option>
<option value="cafe-bar"> Cafe &amp; Bar</option>
<option value="ciftlik"> Çiftlik</option>
<option value="depo-antrepo"> Depo &amp; Antrepo</option>
<option value="dugun-salonu"> Düğün Salonu</option>
<option value="dukkan-magaza"> Dükkan &amp; Mağaza</option>
<option value="enerji-santralleri"> Enerji Santralleri</option>
<option value="fabrika"> Fabrika</option>
<option value="garaj-park-yeri"> Garaj &amp; Park Yeri</option>
<option value="imalathane"> İmalathane</option>
<option value="is-hani-kati-ofisi"> İş Hanı Katı &amp; Ofisi</option>
<option value="kantin"> Kantin</option>
<option value="kir-kahvalti-bahcesi"> Kır &amp; Kahvaltı Bahçesi</option>
<option value="kiraathane"> Kıraathane</option>
<option value="komple-bina"> Komple Bina</option>
<option value="maden-ocagi"> Maden Ocağı</option>
<option value="otopark"> Otopark</option>
<option value="pazar-yeri"> Pazar Yeri</option>
<option value="plaza"> Plaza</option>
<option value="plaza-kati"> Plaza Katı</option>
<option value="prefabrik-yapi"> Prefabrik Yapı</option>
<option value="radyo-istasyonu"> Radyo İstasyonu</option>
<option value="residence-kati-ofisi"> Residence Katı &amp; Ofisi</option>
<option value="restoran-lokanta"> Restoran &amp; Lokanta</option>
<option value="saglik-merkezi"> Sağlık Merkezi</option>
<option value="sinema-konferans-salonu"> Sinema &amp; Konferans Salonu</option>
<option value="spa"> SPA</option>
<option value="spor-tesisi"> Spor Tesisi</option>
<option value="akaryakit-istasyonu"> Akaryakıt İstasyonu</option>
<option value="apartman-dairesi"> Apartman Dairesi</option>
<option value="atolye"> Atölye</option>
<option value="avm"> AVM</option>
<option value="bufe"> Büfe</option>
<option value="buro-ofis"> Büro &amp; Ofis</option>
<option value="cafe-bar"> Cafe &amp; Bar</option>
<option value="ciftlik"> Çiftlik</option>
<option value="depo-antrepo"> Depo &amp; Antrepo</option>
<option value="dugun-salonu"> Düğün Salonu</option>
<option value="dukkan-magaza"> Dükkan &amp; Mağaza</option>
<option value="enerji-santralleri"> Enerji Santralleri</option>
<option value="fabrika"> Fabrika</option>
<option value="garaj-park-yeri"> Garaj &amp; Park Yeri</option>
<option value="imalathane"> İmalathane</option>
<option value="is-hani-kati-ofisi"> İş Hanı Katı &amp; Ofisi</option>
<option value="kantin"> Kantin</option>
<option value="kir-kahvalti-bahcesi"> Kır &amp; Kahvaltı Bahçesi</option>
<option value="kiraathane"> Kıraathane</option>
<option value="komple-bina"> Komple Bina</option>
</optgroup>
</select>
</div>

Answer 1

select2是一个jquery组件。如果您想在vue.js上使用select2，可以使用vue-select2(请参阅https://vue-select.org/guide/values.html#getting-和设置(。

Answer 2

您仍然可以使用jQuery select2，但要获得值，您需要使用v-bind:name，然后在提交时，您可以在Vue方法中获得值并将其存储在data()中

<select
v-bind:name="value"
id="value"
class="form-control"
>
data() {
return {
value: ''
}
}
this.value = $('#value').val();