Что означает «ссылка» в функциональном компоненте vue?

Question

Недавно я читал документ Vue, и когда я читал функциональный компонент, я обнаружил утверждение, которое:

Примечание: в версиях до 2.3.0 props опция требуется, если вы sh принимаете props в функциональном компоненте. В 2.3.0+ вы можете опустить опцию props, и все атрибуты, найденные на узле компонента, будут неявно извлечены как props.

Ссылка будет HTMLElement при использовании с функциональными компонентами, потому что они не сохраняют состояния и не имеют экземпляров.

С оригинальным документом можно ознакомиться здесь .

Я так растерялся из-за слова «ссылка» во второй цитате, что означает эта «ссылка»?

Надеюсь, кто-то может помочь мне понять это, спасибо, мой друг:)

Answer 1

Я не уверен на 100%, но думаю, что это относится к этой ситуации:

Vue.component('functional', {
  functional: true,
  render(h, ctx) {
    return h('button', ctx.data, ctx.children)
  }
})

Vue.component('full', {
  template: '<button><slot/></button>'
})

new Vue({
  el: '#app',
  mounted() {
    console.log(this.$refs.func instanceof HTMLElement)
    console.log(this.$refs.full instanceof Vue)
  }
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>

<div id="app">
  <functional ref="func">Functional</functional>
  <full ref="full">Full</full>
</div>

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

Лучше всего рассматривать функциональный компонент как функцию. Это не «настоящий» компонент.

Ссылка, которую вы получите, зависит от того, как реализован функциональный компонент. Функция рендеринга функционального компонента отвечает за передачу данных ref одному из его дочерних элементов, которые он отображает. В приведенном выше примере ctx.data.ref равен 'func', и ему присваивается <button>, поэтому в root компонент this.$refs.func равен этому элементу DOM. Если я не передал ctx.data кнопке, this.$refs.func всегда будет undefined.