组件递归

• 组件递归时，出现下次标签不渲染。问题处理：
  • name 为组件增加name属性

应用过程

• @scroll 绑定后无效

  • 给绑定元素增加 样式 overflow-x:hidden; | overflow:auto;

• @click 绑定事件阻止行为

  • stop 阻止冒泡
  • prevent 阻止默认事件
  • self 只作用于当前绑定元素
  • 使用修饰符时，顺序很重要，相应的代码会以同样的顺序产生。
  • 例如：用 @click.prevent.self 会阻止所有的点击，而 @click.self.prevent 只会阻止元素上的点击。

• 页面使用多个组件只展示一个

  • 将组件使用双标签展示 如 改为

• hook

• v-on

• v-bind="$props" 展开对象 可以省去写很多 键值对 (用于父子组件传值)

• 将不会后期更改的数据 （或大数据）放弃监听

  • Object.freeze()

• 简易的store

  • const state = Vue.observable({ count: 0 })

• 异步组件 + loading 效果

  • 使用vuex状态控制vm实例。dispatch控制组件的v-if，就不会出现组件未注册的错误或其他错误

其他注意事项 / 坑点

• ERROR Invalid options in vue.config.js: "baseUrl" is not allowed

vue项目版本是 3.10.0 报错

	module.exports = {
	  baseUrl: process.env.NODE_ENV === 'production'
		? './'
		: '/'
	}

在vue-cli.3.3版本后 baseUrl被废除了，因此这边要写成 publicPath

	module.exports = {
	  publicPath: process.env.NODE_ENV === 'production'
		? './'
		: '/'
	}

​

vue-property-decorator

• https://www.jianshu.com/p/d8ed3aa76e9b