Блог

Я создал определяемый пользователем компонент ( async-select ) поверх другого компонента (vue mutliselect) следующим образом:

https://jsfiddle.net/hmds2n6L/4/

Я слышал о функции props fallthrough VueJS, которая означает, что дочерний компонент должен наследовать все реквизиты родительского компонента. Например, multiselect должен наследовать loading prop of . Однако мы видим, что loading prop не передается multiselect , что видно из того факта, что загрузчик не виден. Напротив, если я переместил loading реквизит async-select справа на multiselect компонент следующим образом:

https://jsfiddle.net/hmds2n6L/1/

тогда все работает просто отлично. Я неправильно понимаю концепцию провала prop?

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

 <multiselect
   v-bind="$attrs"
   :options="[]">
</multiselect>
 

Это делает повторную привязку реквизита оболочки к дочернему компоненту. Вот ваша обновленная скрипка