1.4 合并策略

合并策略之所以是难点,其中一个是合并选项类型繁多,大体可以分为以下三类:Vue自定义策略, 父类自身配置, 子类自身策略(用户配置)。如何理解?

  • Vue自定义策略,vue在选项合并的时候对一些特殊的选项有自身定义好的合并策略,例如data的合并,el的合并,而每一个的合并规则都不一样,因此需要对每一个规定选项进行特殊的合并处理
  • 父类自身配置,首先创建一个vue实例时,Vue构造函数自身的options属于父类自身配置,我们需要将实例传递的配置和Vue.options进行合并。再者前面提到的var P = Vue.extends(); var C = P.extends(),P作为C的父类,在合并选项时同样需要考虑进去。
  • 子类自身策略(用户配置),用户自身选项也就是通过new 实例传递的options选项在Vue源码中,如何处理好这三个选项的合并,思路是这样的:

  • 首选默认自定义策略,根据不同选项的策略合并子和父的配置项

  • 不存在自定义策略时,有子类配置选项则默认使用子类配置选项,没有则选择父类配置选项。

  1. function mergeOptions ( parent, child, vm ) {
  2. ···
  3. var options = {};
  4. var key;
  5. for (key in parent) {
  6. mergeField(key);
  7. }
  8. for (key in child) {
  9. if (!hasOwn(parent, key)) {
  10. mergeField(key);
  11. }
  12. }
  13. function mergeField (key) {
  14. var strat = strats[key] || defaultStrat; // 如果有自定义选项策略,则使用自定义选项策略,否则选择子类配置选项
  15. options[key] = strat(parent[key], child[key], vm, key);
  16. }
  17. return options
  18. }