LegnoMultiselect

Examples

Example 1 - Default

Orange Banana Fruit

Apple

Price: $1.20

<legno-multiselect
  label="Fruit"
  :items="fruit"
  :selectedValues="selectedFruit" />

data: {
  fruit: [
    { value: 1, text: 'Apple', bottomText: 'Price: $1.20', buttonText: 'Remove' },
    { value: 2, text: 'Orange', bottomText: 'Price: $2', buttonText: 'Remove' },
    { value: 3, text: 'Banana', bottomText: 'FREE', buttonText: 'Remove' }
  ],
  selectedFruit: [ 1 ]
}

INFO

This component is only available as a Vue.js component.

Example 2 - Combined with LegnoFormContainer

Form title

Apple Orange Banana Fruit

<legno-form-container title="Form title">
  <legno-multiselect
    label="Fruit"
    :items="fruit"
    :selectedValues="selectedFruit" />
</legno-form-container>

data: {
  fruit: [
    { value: 1, text: 'Apple', bottomText: 'Price: $1.20', buttonText: 'Remove' },
    { value: 2, text: 'Orange', bottomText: 'Price: $2', buttonText: 'Remove' },
    { value: 3, text: 'Banana', bottomText: 'FREE', buttonText: 'Remove' }
  ],
  selectedFruit: []
}

INFO

This component is only available as a Vue.js component.

Slots

...

Props

...