Vuejs binding list

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.3.4/vue.min.js"></script>
<ul>
    <button @click="selectCategory1">Select 1 Category</button>
    <button @click="selectCategory2">Select 2 Category</button>
    <select name="" id="">
      <option v-for="cat in sub_categories" value="{{ cat }}">{{ cat }}</option>
    </select>
</ul>

JavaScript

var demo = new Vue({
    el: 'ul',
    data: function() {
			return {
      	categories: [
        	[1, 2, 3, 4, 5],
          [8, 12, 14, 15]
        ],
        sub_categories: []
      };
    },
    methods:{
        selectCategory1: function (e) {
           this.sub_categories = this.categories[0];
        },
        selectCategory2: function (e) {
           this.sub_categories = this.categories[1];
        }
    }

});