Form doesnot show data in edit fieldarray veevalidate

Nabina Khadka answered on March 28, 2023 Popularity 1/10 Helpfulness 1/10

answer Form doesnot show data in edit fieldarray veevalidate

Form doesnot show data in edit fieldarray veevalidate

Comment

vue
<template>
  <Form @submit="onSubmit" :initial-values="initialValues">
    <FieldArray name="links" v-slot="{ fields, push, remove }">
      <div v-for="(field, idx) in fields" :key="field.key">
        <Field :name="`links[${idx}].url`" type="url" />
        <button type="button" @click="remove(idx)">Remove</button>
      </div>
      <button type="button" @click="push({ id: Date.now(), name: '', url: '' })">Add</button>
    </FieldArray>
    <button>Submit</button>
  </Form>
</template>
<script setup>
// you can set initial values for those array fields
const initialValues = {
  links: [{ id: 1, url: 'https://github.com/logaretm' }],
};
function onSubmit(values) {
  alert(JSON.stringify(values, null, 2));
}
</script>

Popularity 1/10 Helpfulness 1/10 Language whatever

Source: vee-validate.logaretm.com

Tags: edit show vee-validate whatever

Link to this answer
Share Copy Link