vue在执行到axios时浏览器报username未定义

Question

<template>
<div class="hello">

<h1>Welcome to {{ msg }}</h1>
<form >
  username:<input type="text" name="username" v-model="u.username"><p/>
  carname:<input type="text" name="carname" v-model="u.carname"><p/>
  price:<input type="text" name="price" v-model="u.price"><p/>
  number:<input type="text" name="number" v-model="u.number"><p/>
  <input type="button" value="submit" @click="submit(u)"><p/>
</form>

</div>
</template>
<script>
import axios from 'axios'
import qs from 'qs'
export default {

data(){
    return{
        msg:'insert',
        u:[]
    }
},
methods:{
    submit:function(u){
        let data=qs.stringify({
            "username":u.username,
            "carname":u.carname,
            "price":u.price,
            "number":u.number  
        })
        console.log(data)
        // this.u=this.data
        axios.get("api/orders/insert?u="+data).then(res=>{
            console.log(res.data)
            // this.$router.push({name:"user"})
        })
    },
},
 mounted(){
    this.submit(this.$route.params.u)
}

}
</script>

Answer 1

data里面的u是数组格式，form里面的是Object格式，肯定有问题；

data(){
    return{
        msg:'insert',
        // u:[]
        u:{}
    }
},