Почему есть предупреждение для функции предоставления и ввода Vue?

Question

Я думаю об использовании в проекте новой функции предоставления / ввода Vue, однако в официальной документации Vue это выдает следующее предупреждение:

в первую очередь предоставляются и вводятсядля расширенных вариантов использования библиотеки плагинов / компонентов.НЕ рекомендуется использовать их в общем коде приложения.

Тем не менее, документы не дают причины, почему.В чем опасность использования предоставления и внедрения в «универсальном коде приложения», а не в «расширенных вариантах использования библиотеки плагинов / компонентов»?

В примере кода:

// parent component providing 'foo'
var Provider = {
  provide: {
    foo: 'bar'
  },
  // ...
}

// child component injecting 'foo'
var Child = {
  inject: ['foo'],
  created () {
    console.log(this.foo) // => "bar"
  }
  // ...
}

Преимуществонасколько я понимаю, если у вас есть несколько вложенных дочерних компонентов, вы можете пропустить передачу реквизитов по каждому вложенному дочернему элементу и просто «получить» введенное значение, например, непосредственно в компоненте внука.

Вы можете даже сделать введенное значение реактивным, если вы обойдете поведение по умолчанию нереактивности «если вы пропустите наблюдаемый объект», но здесь предупреждение будет иметь смысл, поскольку у вас будетреактивные переменные, охватывающие вложенные компоненты, где данные не должны передаваться таким образом, поэтому отслеживание изменений может стать более запутанным, если используются реактивные объекты.

Answer 1

Согласно руководству по стилю: https://vuejs.org/v2/style-guide/#Implicit-parent-child-communication-use-with-caution

Реквизиты и события должны быть предпочтительными для связи родительских и дочерних компонентов, вместо этого. $ Parent или мутирующие реквизиты.

Anидеальное приложение Vue - опора, события - вверхТем не менее, существуют крайние случаи, когда prop мутация или эта. $ Parent может упростить два компонента, которые уже глубоко связаны.

Проблема в том, что есть также много простых случаев, когда эти шаблоны могут предложить удобство.Осторожно: не соблазняйтесь на простоту торговли (способность понимать поток вашего состояния) для кратковременного удобства (написание меньшего количества кода).

В этом конкретном случае вы, по сути, будете мутировать реквизитыс inject.Вы захотите обратить особое внимание на тот факт, что использование provide / inject в стандартном приложении не соответствует каноническому подходу.Если вы хотите отобразить состояние в иерархию компонентов, предпочтительным вариантом будет vuex .