I am trying to create a component that contains all my logic on the select component of vue select and I have a problem with the slot part. With vue-select, you have a slot inside the v-select to handle special data like this:

    <template>
     <div class="select">
      <v-select :label="label" :options="options">

        <!-- Slot if no results on search -->
        <template slot="no-options">
          <slot name="no-results">Here I can set data from the parent component</slot>
        </template>

      </v-select>
    </div>
  </template>

In this case, the data is static, so I can use a slot and add the data here, it's not a problem. But as you can see here for the second slot:

    <template>
     <div class="select">
      <v-select :label="label" :options="options">

        <!-- Slot if no results on search -->
        <template slot="no-options">
          <slot name="no-results">Here I can set data from the parent component</slot>
        </template>

        <!-- Slot of the placeholder when option is selected -->
        <template slot="selected-option" slot-scope="option">
          <slot name="selected-option">{{ option.label }}</slot>
        </template>

      </v-select>
    </div>
  </template>

We use slot-scope="option", and we have two levels between the parent and the child. So is it possible to have a slot-scope with two levels of hierarchy or do I need to find another way to do it?