Select optionFormat issue

[Kestami]

Development Relevant Information:

BalmUI version: 9.38.2
Browser: Chrome
Operating System: Win 10

Hi,

I'm trying to change the bound optionFormat for a select dropdown.

This works (default bindings):

//component
<ui-select v-model="myModel"
                 :options="options">
Dropdown
</ui-select>

//data
data: {
   myModel: ''
   options: [
      {
         label: 'test1',
         value: 1
      },
      {
         label: 'test2',
         value: 2
      }
  ]
}

And when the incoming data has different names, it doesn't seem to work:

//component
<ui-select v-model="myModel"
                 :options="options"
                 optionFormat="{ label: 'myLabel', value: 'myValue' }">
Dropdown
</ui-select>

//data
data: {
   myModel: ''
   options: [
      {
         myLabel: 'test1',
         myValue: 1
      },
      {
         myLabel: 'test2',
         myValue: 2
      }
  ]
}

Am I doing something wrong here in the way that I'm configuring it, or could you check if this is a bug?

Cheers!

[elf-mouse]

Hi @Kestami ,

It's :optionFormat not optionFormat, please check your code again~

[Kestami]

Apologies! That's worked. Thanks!

Apart from just trying both optionFormat and :optionFormat, is there a way the documentation indicates when it needs a : at the start? Is it just when the type is not primitive?

Cheers.

[elf-mouse]

Apologies! That's worked. Thanks!

Apart from just trying both optionFormat and :optionFormat, is there a way the documentation indicates when it needs a : at the start? Is it just when the type is not primitive?

Cheers.

This is the basic syntax of Vue. See the vue documentation for more.

[Kestami]

Perfect, thanks!