How to use slot=”foobar” in Vue3

Following is Vue2 code which is refactored for Vue3 below.

<f7-list-input label="Search patient" :input="false">
    <vue-simple-suggest
        slot="input"
      class="item-input-wrap"
      :max-suggestions="10"
      :nullable-select="false"
      :min-length="4"
      @update:model-select="onPatientSelected"
      :list="queryPatient"
    >
    </vue-simple-suggest>
</f7-list-input>
<f7-list-input label="Search patient" :input="false">
  <template v-slot:input>
    <vue-simple-suggest
      class="item-input-wrap"
      :max-suggestions="10"
      :nullable-select="false"
      :min-length="4"
      @update:model-select="onPatientSelected"
      :list="queryPatient"
    >
    </vue-simple-suggest>
  </template>
</f7-list-input>

Leave a Reply