开发通用组件是很基础且重要的工作,通用组件必须具备高性能、低耦合的特性
一、数据从父组件传入
为了解耦,子组件本身就不能生成数据。即使生成了,也只能在组件内部运作,不能传递出去。
父对子传参,就需要用到props,但是通用组件的的应用场景比较复杂,对 props 传递的参数应该添加一些验证规则
二、在父组件处理事件
在通用组件中,通常会需要有各种事件,
比如复选框的 change 事件,或者组件中某个按钮的 click 事件
这些事件的处理方法应当尽量放到父组件中,通用组件本身只作为一个中转
三、记得留一个 slot
一个通用组件,往往不能够完美的适应所有应用场景
所以在封装组件的时候,只需要完成组件 80% 的功能,剩下的 20% 让父组件通过 solt 解决
四、不要依赖 Vuex
父子组件之间是通过 props 和 自定义事件 来传参,非父子组件通常会采用 Vuex 传参
但是 Vuex 的设计初衷是用来管理组件状态,虽然可以用来传参,但并不推荐
因为 Vuex 类似于一个全局变量,会一直占用内存
在写入数据庞大的 state 的时候,就会产生内存泄露
五、合理运用 scoped 编写 CSS
在编写组件的时候,可以在