VUE中 mounted

mounted是Vue实例的生命周期钩子函数之一，表示实例已经被挂载到页面上，即视图已经渲染完毕。在这个时候，数据已经被处理好了，可以访问DOM元素，可以进行一些需要DOM操作的初始化工作，如添加事件监听器、获取元素宽高等等。

mounted函数会在实例被挂载后立即执行，只会执行一次。同时，mounted函数中的代码一定要在DOM渲染完成后才能执行，因此，如果需要访问DOM元素，一定要在mounted函数中进行。

以下是一个例子：

<template>
  <div>
    <p>{{ message }}</p>
    <button @click="changeMessage">修改消息</button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      message: 'Hello, World!',
    };
  },
  mounted() {
    console.log('mounted');
  },
  methods: {
    changeMessage() {
      this.message = 'Hello, Vue!';
    },
  },
};
</script>

上面这个例子中，mounted函数会在实例被挂载到页面上后执行，输出'mounted'。同时，点击按钮会触发changeMessage函数，修改message的值，这时页面会重新渲染，但mounted函数不会再次执行