vue.js 加载完成事件

<template>
  <div>
    <!-- 组件内容 -->
  </div>
</template>

<script>
export default {
  mounted() {
    console.log('组件已挂载到 DOM');
    // 在这里执行加载完成后的逻辑
  }
}
</script>

<template>
  <div>{{ message }}</div>
</template>

<script>
export default {
  data() {
    return {
      message: 'Hello Vue!'
    };
  },
  methods: {
    updateMessage() {
      this.message = 'Updated message';
      this.$nextTick(() => {
        console.log('DOM 已更新');
        // 在这里执行 DOM 更新后的逻辑
      });
    }
  }
}
</script>

<template>
  <div>
    <!-- 组件内容 -->
  </div>
</template>

<script>
export default {
  async mounted() {
    await this.fetchData();
  },
  methods: {
    async fetchData() {
      try {
        const response = await fetch('https://api.example.com/data');
        const data = await response.json();
        console.log(data);
      } catch (error) {
        console.error('获取数据失败:', error);
      }
    }
  }
}
</script>