Vue笔记。

Computed和methods

在一个页面中，Computed不管被调用几次，实际上都只调用一次，且计算结果会缓存，但依赖改变依然会重新计算。而每次调用methods，实际上都会重新调用，所以页面中逻辑可以尽量写在Computed里然后通过插值方法调用（意识流文章×

Component组件

在 Vue 中，有两种方式注册组件：全局注册和局部注册。

1. 全局注册：使用 Vue.component(tagName, options) 注册。注册后的组件可以用于任意 Vue 实例和组件的模板中。注意：第一个参数必须是组件的名称。

Vue.component('parent-component', {
  template: '<div>Parent</div>'
})

2. 局部注册：通过一个普通的 JavaScript 对象来定义组件，然后在需要使用该组件的父组件的 components 选项中进行注册。

// 定义子组件
const child = {
  template: '<div>child</div>'
}

// 在父组件中局部注册
new Vue({
  el: '#app',
  components: {
    'child-component': child
  }
})

• template中必须只能有一个根节点（Vue 2 限制）
• 子组件无法直接访问到父组件中的数据（单向数据流）
• 组件中的data必须是一个函数

父子组件通信方式

• 【父->子】使用props属性(使用props传递逻辑值时记得在属性前加 : 例如 :myprops="true"。否则作为字面量传递，子组件收到的会是字符串 "true" 而非布尔值 true)。
• 【父<-子】父组件需在模板中监听一个事件，子组件通过 this.$emit('事件名', 传参) 来触发。例如：this.$emit('get', 1000)。

生命周期

当 Vue 实例中的响应式数据被修改，或者由此引起 DOM 树发生局部更新时，会依次调用 beforeUpdate() 和 updated() 周期。

特别注意：DOM 更新绝对不会重新循环生命周期，也绝对不会重新触发 created() 或 mounted() 钩子。mounted() 仅在组件首次初始化并挂载到真实 DOM 时执行一次。

vue.config.js

• 改了配置文件一定要重启服务器

反向代理设置

vue中的反向代理设置实际上是通过node的中间件http-proxy-middleware实现的

[toc]