Vue的生命周期及使用方法

Vue的生命周期分为8个阶段，分别是：

1. beforeCreate：实例刚被创建，数据观测和事件机制都未初始化。

2. created：实例已经创建完成，数据观测和事件机制都已经初始化，但是此时 $el 属性并未被初始化。

3. beforeMount：在挂载之前被调用，相关的 render 函数首次被调用。

4. mounted：实例已经挂载到 DOM 上，在这个阶段可以对 DOM 进行操作。

5. beforeUpdate：数据更新时调用，但是此时页面并未渲染。

6. updated：数据更新完成，页面已经重新渲染。

7. beforeDestroy：实例销毁之前调用。

8. destroyed：实例已经被销毁，此时所有的事件监听和数据观测都已经被取消。

使用方法：

1. 创建Vue实例：

new Vue({
  el: '#app',
  data: {
    message: 'Hello Vue.js!'
  },
  methods: {
    handleClick: function () {
      alert('clicked')
    }
  }
})

2. 在 HTML 中绑定数据和事件：

<div id="app">
  {{ message }}
  <button v-on:click="handleClick">Click me</button>
</div>

3. 使用计算属性：

new Vue({
  el: '#app',
  data: {
    firstName: 'John',
    lastName: 'Doe'
  },
  computed: {
    fullName: function () {
      return this.firstName + ' ' + this.lastName
    }
  }
})

4. 使用组件：

Vue.component('my-component', {
  template: '<div>{{ message }}</div>',
  data: function () {
    return {
      message: 'Hello Vue.js!'
    }
  }
})

new Vue({
  el: '#app'
})

以上是Vue的基本使用方法，更多详细内容可以参考Vue官方文档。