[Vuejs]-Passing arguments to button onclick method in vuejs

The yr variable only exists within the scope of option when you used v-for on it.

That’s why it’s causing an error when you try to pass it to the event handler of your button which is located outside the scope of v-for.

How can I get selected option?

One way to get the year selected is to declare a year variable under your component data attribute and use the v-model directive on your select field to form a two-way binding.

data: function() {
  return {
    year: null
  }
}

And in your select and button tags,

<select class="form-control input-sm" style="width:120px" id="select-Year" v-model="year">
  <option v-for="yr in years" value="yr">{{ yr }}</option>
</select>

<button id="btnSubmit" class="btn btn-primary" style="align:center" v-on:click="loadData($event)">Open</button>

In this way, you can get access to the year in loadData,

loadData(event) {
  console.log(this.year, event);
}