vue.js

filter select vue.js
23 января, 2020 |

Код html

<div class="">
  <div class="">
    <select id="selcountry" v-model="selcountry" class="">
      <option selected="selected">All countries</option>
      <option>101</option>
      <option>102</option>
    </select>
  </div>
  <div class="">
    <select id="selsex" v-model="selsex" class="">
      <option selected="selected">Any gender</option>
      <option>201</option>
      <option>202</option>
      <option>203</option>
    </select>
  </div>
  <div class="">
    <select id="selvacancytitle" v-model="selvacancytitle" class="">
      <option selected="selected">All professions</option>
      <option>301</option>
      <option>302</option>
    </select>
  </div>
  <button id="clearselect" v-on:click="clearselect();">
    Reset filters
  </button>
</div>

Обработчик: начальная установка и сброс по клику по кнопке

<script type="text/javascript">
var vuejs = new Vue({
    el: '#vue',
    data: {
        selcountry: 'All countries',
        selsex: 'Any gender',
        selvacancytitle: 'All professions'
    },
    methods: {
        clearselect: function () {
            this.selcountry = 'All countries',
            this.selsex = 'Any gender',
            this.selvacancytitle = 'All professions'
        }
    }
}) 
</script>

 

Предыдущий пост Следующий пост