Магия примесей и расширений vue

JavaScript Vue.js MVVM

написать впереди

Vue предоставляет примеси и расширяет элементы конфигурации, которые в последнее время оказались очень полезными. Пожалуйста, поправьте меня, если я ошибаюсь, спасибо Youda за предоставление эффективных производственных инструментов.

Смешивание примесей и наследование расширений

Посмотрите, как написаны официальные документы, на самом деле и то, и другое можно понимать как наследование, миксины получают массив объектов (понимается как множественное наследование), а расширения получают объекты или функции (понимается как одиночное наследование).

Наследовать функцию ловушки

const extend = {
  created () {
    console.log('extends created')
  }
}
const mixin1 = {
  created () {
    console.log('mixin1 created')
  }
}
const mixin2 = {
  created () {
    console.log('mixin2 created')
  }
}
export default {
  extends: extend,
  mixins: [mixin1, mixin2],
  name: 'app',
  created () {
    console.log('created')
  }
}

консольный вывод

extends created
mixin1 created
mixin2 created
created
  • Вывод: родительский класс, унаследованный миксинами и расширениями, вызывается первым, и приоритет, вызванный расширениями, выше, чем у очереди.
  • push(extend, mixin1, minxin2, собственная функция ловушки)
  • после тестирования,стоимость часовПравила наследования те же.

наследовать методы

const extend = {
  data () {
    return {
      name: 'extend name'
    }
  }
}
const mixin1 = {
  data () {
    return {
      name: 'mixin1 name'
    }
  }
}
const mixin2 = {
  data () {
    return {
      name: 'mixin2 name'
    }
  }
}
// name = 'name'
export default {
  mixins: [mixin1, mixin2],
  extends: extend,
  name: 'app',
  data () {
    return {
      name: 'name'
    }
  }
}
// 只写出子类,name = 'mixin2 name',extends优先级高会被mixins覆盖
export default {
  mixins: [mixin1, mixin2],
  extends: extend,
  name: 'app'
}
// 只写出子类,name = 'mixin1 name',mixins后面继承会覆盖前面的
export default {
  mixins: [mixin2, mixin1],
  extends: extend,
  name: 'app'
}
  • Вывод: подкласс объявляется снова, и переменные в данных будут перезаписаны, в зависимости от того, какой из них является подклассом.
  • Если подкласс не объявлен, переменные в данных будут унаследованы от последнего родительского класса.
  • после тестирования,Свойства в реквизите,методы в методаха такжезначение вычисляемогоПравила наследования те же.

написать на обороте

Что касается примесей и расширений, вы можете понимать это как c (контроллер) mvc, этот слой. Можно видеть, что общие переменные-члены (включая свойства и методы) абстрагируются в родительский класс, который предоставляется подклассам для наследования, так что подкласс может иметь некоторые общие переменные-члены, но подкласс также может переопределять переменные-члены. родительского класса. Вся эта программная идея очень объектно-ориентирована, то есть наследование.