[Vue3] Implement dynamic binding example in drop-down box in Vue3

 

  <div>
    <select v-model="selected" @change="handleChange">
      <option
        v-for="option in options"
        :key="option.value"
        :value="option.value"
      >
        {
   
   { option.text }}
      </option>
    </select>
  </div>

import { ref } from "vue";
export default {
  name: "Home",
  setup() {
    const selected = ref("1");
    const options = [
      { text: "消费", value: "1" },
      { text: "充值", value: "2" },
    ];

    function handleChange() {
      alert(selected.value);
    }

    function clear() {
      selected.value = "1";
    }

    vm = {
      selected,
      options,
      handleChange,
    };
    return vm;
  },
};