Dynamic data in the columns options using ion-picker [Ionic] [Vue]

75 Views Asked by At

I need help with ion-picker.

I'm using Ionic + Vue to build an app. The selector that has caught my attention the most is ion-picker which is within the following link https://ionicframework.com/docs/api/picker

Inline Pickers Section (Recommended)​

The Vue example works perfectly. But I would like to pass the values of options: [] dynamically from the backend. Which returns the values of "text" and "value" respectively. However, when I do that it shows me a blank picker and it doesn't work 100%.

Documentation data:

const pickerColumns = [
   {
      name: 'languages',
      options: [
         {
            text: 'JavaScript',
            value: 'javascript',
         },
         {
            text: 'TypeScript',
            value: 'typescript',
         },
         {
            text: 'Rust',
            value: 'rust',
         },
         {
            text: 'C#',
            value: 'c#',
         },
      ],
   },
];

I'm using:

Vue 3.
Ionic 7.
Composition API.

Any ideas? Thanks in advance.

0

There are 0 best solutions below