vue响应式基础

用 data 选项来声明组件的响应式状态。此选项的值应为返回一个对象的函数。此对象的所有顶层属性都会被代理到当前组件实例 (即方法和生命周期钩子中的 this) 上

Vue 在组件实例上暴露的内置 API 使用 $ 作为前缀。它同时也为内部属性保留 _ 前缀。因此，你应该避免在顶层 data 上使用任何以这些字符作前缀的属性。

要为组件添加方法，我们需要用到 methods 选项。它应该是一个包含所有方法的对象。Vue 自动为 methods 中的方法绑定了永远指向组件实例的 this。不应该在定义 methods 时使用箭头函数，因为箭头函数没有自己的 this 上下文。

export default {
  data() {
    return {
      count: 0
    }
  },
  methods: {
    increment() {
      this.count++
    }
  }
}

组件实例上的属性、方法可以在当前组件的模板上直接使用