iam using vueForm https://vueform.com/ in nuxt3
i have the following schema for a list with 2 select elements that need to be connected (country-city connection) , I need to load the correct list of cities through an API based on the country that the user selects
the problem is that I can't connect it to the current index
I can add this: items:"myApi?country={location.0.country}"
but how can i achieve this items:"myApi?country={location.<index>.country}"
location: {
type: "list",
element: {
type: "object",
schema: {
country: {
columns: {
container: 6,
},
type: "select",
placeholder: "Country",
closeOnSelect: true,
items: [
{
value: "country1",
label: "Country 1",
},
{
value: "country2",
label: "Country 2",
},
],
search: true,
native: false,
inputType: "search",
autocomplete: "off",
floating: false,
},
city: {
columns: {
container: 6,
},
type: "select",
placeholder: "City",
closeOnSelect: true,
items:"myApi?country={location.0.country}",
search: true,
native: false,
inputType: "search",
autocomplete: "off",
floating: false,
},
},
},
addText: "Add another",
initial: 1,
min: 1,
max: 15,
},
notes :
onChange: (val, _, form) => {
form.el$.children$[0].schema.city.items = [
{
'value': 0,
'label': 'val',
},
{
'value': 1,
'label': 'val',
},
];
},
update , this works when using items:"myApi?country={location.*.country}"