尝试在Vue组件中使用Select2，但选项为空？

<template>
  <div>
    <select v-model="selectedOption" ref="select2"></select>
  </div>
</template>

<script>
import 'select2/dist/css/select2.css'
import 'select2/dist/js/select2.js'

export default {
  data() {
    return {
      selectedOption: null,
      options: [] // 选项数据
    }
  },
  mounted() {
    // 异步请求获取选项数据
    this.fetchOptions().then((data) => {
      this.options = data;
      this.initSelect2();
    });
  },
  methods: {
    fetchOptions() {
      // 异步请求选项数据的逻辑
    },
    initSelect2() {
      // 在DOM更新后初始化Select2组件
      this.$nextTick(() => {
        $(this.$refs.select2).select2({
          data: this.options
        });
      });
    }
  }
}
</script>