Vue-multiselect: Custom option template with option groups

[jcasale]

When using the options template from Custom option template, the options group is blank.

<template slot="option" slot-scope="props">
  <div class="option__desc">
    <div>
      <span class="option__title">{{ props.option.policy }}</span>
    </div>
    <div class="mt-1">
      <span class="option__small small">{{ props.option.description }}</span>
    </div>
  </div>
</template>

In addition, I cannot find any documentation describing what is needed to custom it.

Is it possible to customize the options (and group hopefully) when using grouping?

[jcasale]

Missed the props.option['$isLabel'] property. For anyone who lands here:

<template slot="option" slot-scope="props">
  <div class="option__desc" v-if="props.option['$isLabel'] === true">
    <div>
      <span class="option__title">{{ props.option['$groupLabel'].name }}</span>
    </div>
    <div>
      <span class="option__small small">{{ props.option['$groupLabel'].description }}</span>
    </div>
  </div>
  <div v-else>
    <div>
      <span class="option__title">{{ props.option.name }}</span>
    </div>
    <div>
      <span class="option__small small">{{ props.option.description }}</span>
    </div>
  </div>
</template>

[frederic117]

Hello :)
I don't know how to make the group-label appears with Custom option template...

Please could you help me ?
THanks a lot

Reproduction Link

https://jsfiddle.net/nxgeo04r/