Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

113
Visualizações
How can i passing data props to "units" form and v-model?

i'm learning vue js 3 and inertia, but i'm having problem when displaying props data into my v-model from reactive form, please help me. Thank you

This is my code:

    data (props) {
        const form = reactive ({
            invoice_code: props.invoice.invoice_code,
            customer_name: props.invoice.customer_name,
            units: [{
                unit_quantity: props.invoice.units.unit_quantity,
                unit_type: props.invoice.units.unit_type,
                unit_name: props.invoice.units.unit_name,
                unit_description: props.invoice.units.unit_description,
                unit_completeness: props.invoice.units.unit_completeness,
                unit_cost: props.invoice.units.unit_cost,
            }],
        })
        function update () {
            Inertia.put(`/invoice/`+ props.invoice.id, form)
        }
        return { form, update }
    },
    props: {
        invoice: Object,
    },
  }
};

how to displaying this [units] into v model?

its work when i use this

unit_quantity: props.invoice.units[0].unit_quantity,

but this only displaying with index [0], not to multi value

    <table>
     <tr>
       <th>Qty</th>
       <th>Unit</th>
       <th>Unit Name</th>
       <th>Description</th>
       <th>Completeness</th>
       <th>Cost</th>
     </tr>
     <tr v-for="(unit, index) in form.units" :key="unit.id">
        <td>
          <input type="number" v-model="unit.unit_quantity">
        </td>
        <td>
          <select v-model="unit.unit_type">
            <option value="Camera">Camera</option>
            <option value="Phone">Phone</option>
            <option value="Laptop-PC">Laptop-PC</option>
            <option value="Other">Other</option>
          </select>
        </td>
        <td>
          <input type="text" v-model="unit.unit_name">
        </td>           
        <td>
          <input type="text" v-model="unit.unit_description">
        </td>
        <td>
          <input type="text" v-model="unit.unit_completeness">
        </td>
        <td>
          <input type="number" v-model="unit.unit_cost">
        </td>
      </tr>
  </table>

this my template

about 4 years ago · Juan Pablo Isaza
1 Respostas
Responde à pergunta

0

You only have 1 unit in your units array. Try setting your units like this.

data (props) {
        const form = reactive ({
            invoice_code: props.invoice.invoice_code,
            customer_name: props.invoice.customer_name,
            units: units: props.invoice.units,
        })
        function update () {
            Inertia.put(`/invoice/`+ props.invoice.id, form)
        }
        return { form, update }
    },
    props: {
        invoice: Object,
    },
  }
about 4 years ago · Juan Pablo Isaza Relatório
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda