vue - cannot convert submitEvent.target to formdata

user15217679

update

I made a correct function based on the answer below

export function submitEvent_2_json(e) {
    const jsondata = {}
    let fd= new FormData(e.target)
    for (let key of fd.entries()) {
        jsondata[key[0]]=key[1]
    }
    return jsondata
}

origional problem

I'm trying to get data from form and convert it to json
It's obvious that data is in submitEvent.target(as follow picture), but the result is undefined or null

<template>
<form @submit.prevent="submit">
  <input id="aa"/>
  <button type="submit">ok</button>
</form>
</template>

<script setup>
function submit(e) {
  console.log(e)
  let fd= new FormData(e.target)
  console.log(fd)
  console.log(e.formData)
  console.log(fd.entries())
}
</script>

output
submitevent output

Mina

That's how FormData works

FormData is a special type of object which is not stringifyable can cannot just be printed out using console.log

If you want to get an item inside, you can use get method.

EX:

fd.get('username');

If you want get all entries inside, you can loop through

for (var key of fd.entries()) {
  console.log(key[0] + ', ' + key[1])
}

Collected from the Internet

Please contact [email protected] to delete if infringement.

edited at
0

Comments

0 comments
Login to comment

Related

How to type SubmitEvent so that event.target.children is known?

FormData is missing submit's value - get it, maybe without SubmitEvent.submitter?

Cannot convert source type to target type compilation error

Cannot convert type 'NinjectValidationFactory' to target type 'FluentValidation.IValidatorFactory

Cannot convert source type T? to target type T?

Convert object with nested arrays to FormData

Vue 3 axios sending formdata

Cannot populate FormData using the constructor

Cannot parse FormData into django backend

FormData cannot appended with File Object

Vue: Error in created hook: "TypeError: Cannot convert undefined or null to object"

Cannot convert undefined or null to object in vue using firestore

NotImplementedError: Cannot convert a symbolic Tensor (2nd_target:0) to a numpy array

Cannot convert source type 'System Linq IQueryable<decimal>' to target type decimal

Convert a PreBuildEvent to a Target with a Condition?

Cannot target body in CSS

Cannot Change Target Framework?

How to convert embed/nested FormGroup to FormData

Convert Formdata to jpeg file in Rails 5

Convert Data URI to File then append to FormData

convert nested json object to formdata javascript for Multer

How to convert a formData object to binary in javascript?

Convert from Formdata object to javascript array

Convert formData with nested keys to JS Object

JS Object width FormData convert zu in String

Vue axios FormData object transforms appended values

How To Use FormData() For Uploading File In Vue

vue axios post how to submit formdata array?

Vue-Laravel file formdata always empty

TOP Ranking

  1. 1

    Failed to listen on localhost:8000 (reason: Cannot assign requested address)

  2. 2

    Loopback Error: connect ECONNREFUSED 127.0.0.1:3306 (MAMP)

  3. 3

    How to import an asset in swift using Bundle.main.path() in a react-native native module

  4. 4

    pump.io port in URL

  5. 5

    Compiler error CS0246 (type or namespace not found) on using Ninject in ASP.NET vNext

  6. 6

    BigQuery - concatenate ignoring NULL

  7. 7

    ngClass error (Can't bind ngClass since it isn't a known property of div) in Angular 11.0.3

  8. 8

    ggplotly no applicable method for 'plotly_build' applied to an object of class "NULL" if statements

  9. 9

    Spring Boot JPA PostgreSQL Web App - Internal Authentication Error

  10. 10

    How to remove the extra space from right in a webview?

  11. 11

    java.lang.NullPointerException: Cannot read the array length because "<local3>" is null

  12. 12

    Jquery different data trapped from direct mousedown event and simulation via $(this).trigger('mousedown');

  13. 13

    flutter: dropdown item programmatically unselect problem

  14. 14

    How to use merge windows unallocated space into Ubuntu using GParted?

  15. 15

    Change dd-mm-yyyy date format of dataframe date column to yyyy-mm-dd

  16. 16

    Nuget add packages gives access denied errors

  17. 17

    Svchost high CPU from Microsoft.BingWeather app errors

  18. 18

    Can't pre-populate phone number and message body in SMS link on iPhones when SMS app is not running in the background

  19. 19

    12.04.3--- Dconf Editor won't show com>canonical>unity option

  20. 20

    Any way to remove trailing whitespace *FOR EDITED* lines in Eclipse [for Java]?

  21. 21

    maven-jaxb2-plugin cannot generate classes due to two declarations cause a collision in ObjectFactory class

HotTag

Archive