mounted或created如何使用，请举例

"mounted" 和 "created" 是 Vue.js 中的生命周期钩子函数，用于在组件实例化、挂载、更新等不同阶段执行一些操作。下面举例说明如何使用这两个函数：

1. mounted: 当组件挂载到 DOM 后执行，一般用于操作 DOM 元素或请求数据。

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

<script>
export default {
  data() {
    return {
      message: 'Hello, World!'
    }
  },
  mounted() {
    // 在组件挂载后，修改 DOM 元素的样式
    this.$refs.title.style.color = 'red'
    // 在组件挂载后，发送请求获取数据
    axios.get('/api/data').then(response => {
      this.message = response.data.message
    })
  }
}
</script>

2. created: 在组件实例化后立即执行，一般用于初始化数据或调用方法。

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

<script>
export default {
  data() {
    return {
      message: ''
    }
  },
  created() {
    // 在组件实例化后，初始化数据
    this.message = 'Hello, World!'
    // 在组件实例化后，调用方法
    this.sayHello()
  },
  methods: {
    sayHello() {
      console.log('Hello, Vue!')
    }
  }
}
</script>