How do I use different props in a single component element?
The code:
<BaseTitle v-slot="[{ highlightClass, highlightColor }]" tag="h6">
Lorum Ipsum
<span :class="highlightClass" :highlight-color="secondary“>Highlighted Statement Copy</span>
</BaseTitle>
With v-slot I am „importing“ the different props; but how do I adjust the validator it should use? The props in BaseTitle component:
highlightColor: {
type: String,
required: false,
default: 'primary',
validator: (v) =>
[
'primary',
'secondary',
'tertiary',
'transparent',
'transparent-gray',
'white',
'light',
'dark'
].includes(v)
}
Whats wrong? Thanks