目前,我了解了Vue js,并完成了我的小全堆栈项目。我希望表单中的数据被发送到后端。这是我的Vue组件
<template>
<div id="edit">
<h3 align="center">Insert New Data</h3>
<div id="form">
<b-form-group id="input-group-1" label="Constructor" label-for="input-1">
<b-form-input id="input-1" placeholder="Enter Constructor" v-model="teamConstructor"></b-form-input>
</b-form-group>
<b-form-group id="input-group-2" label="Team Principle" label-for="input-2">
<b-form-input id="input-2" placeholder="Enter Team Principle" v-model="teamPrinciple"></b-form-input>
</b-form-group>
<b-form-group id="input-group-3" label="Team Base" label-for="input-3">
<b-form-input id="input-3" placeholder="Enter Team Base" v-model="base"></b-form-input>
</b-form-group>
<b-form-group id="input-group-4" label="Power Unit" label-for="input-4">
<b-form-input id="input-4" placeholder="Enter Power Unit" v-model="powerUnit"></b-form-input>
</b-form-group>
<b-form-group id="input-group-5" label="Car Chassis" label-for="input-5">
<b-form-input id="input-5" placeholder="Enter Chassis Code" v-model="chassis"></b-form-input>
</b-form-group>
<b-form-group id="input-group-6" label="Driver Name" label-for="input-5">
<b-form-input id="input-6" placeholder="Enter Driver Name" v-model="driver.name"></b-form-input>
</b-form-group>
<b-button class="mt-5" variant="primary" v-click="postData">Submit</b-button>
</div>
</div>
</template>
<script>
export default {
name: 'edit',
data () {
return {
teamConstructor: '',
teamPrinciple: '',
base: '',
powerUnit: '',
chassis: '',
driver: {
name: ''
}
}
},
method: {
postData () {
let toPost = {
teamConstructor: this.teamConstructor,
teamPrinciple: this.teamPrinciple,
base: this.base,
powerUnit: this.powerUnit,
chassis: this.chassis,
driver: {
name: this.name
}
}
console.log(toPost)
}
}
}
</script>在添加post请求函数之前,我希望确保当我单击按钮时,数据会显示在控制台中。而不是数据,我得到了这个错误
[Vue warn]: Property or method "postData" is not defined on the instance but referenced during render.我不明白错误,我一直在寻找答案,但错误仍然存在。任何答复都将不胜感激。提前谢谢!
发布于 2020-09-24 05:26:31
您有一个错误:methods而不是method
https://stackoverflow.com/questions/64039943
复制相似问题