Vuejs如何从数据库中自动选择下拉值

<template>
  <div>
    <select v-model="selectedValue">
      <option v-for="option in options" :value="option.id" :key="option.id">
        {{ option.name }}
      </option>
    </select>
  </div>
</template>

<script>
export default {
  data() {
    return {
      selectedValue: null,
      options: []
    };
  },
  mounted() {
    // 发送异步请求获取下拉值的数据
    this.fetchOptions();
  },
  methods: {
    fetchOptions() {
      // 发送异步请求到后端API
      // 假设后端API的URL为 '/api/options'
      // 使用axios库发送请求，需要先安装axios并导入
      axios.get('/api/options')
        .then(response => {
          // 请求成功，将数据保存在组件的数据属性中
          this.options = response.data;
        })
        .catch(error => {
          // 请求失败，处理错误
          console.error(error);
        });
    }
  }
};
</script>