我的小应用程序出现问题,我的个人资料页面需要显示可以编辑的联系方式,因此当我尝试更新时,就会出现此错误
更新profile_contacts
设置phone
='1111111111',linkedin_profile
='http:linkedin.com'其中id
='undefined'
当前,在MySQL,sequelize,node.js,express和vue.js中使用的技术。
<template>
<b-modal id="editContactInfo" title="Edit your contact information" size="lg">
<b-form>
<b-form-group id="phoneGroup" label="Phone" label-for="phoneInput">
<b-form-input id="phoneInput" type="text" v-model="form.phone" ref="focusThis"></b-form-input>
</b-form-group>
<b-form-group id="emailGroup" label="Email" label-for="emailInput">
<b-form-input id="emailInput" type="email" v-model="form.email" readonly></b-form-input>
</b-form-group>
<b-form-group id="linkedInProfileGroup" label="LinkedIn profile" label-for="linkedInProfileInput">
<b-form-input id="linkedInProfileInput" type="text" v-model="form.linkedin_profile"></b-form-input>
</b-form-group>
</b-form>
<div slot="modal-footer" class="w-100">
<div class="float-right">
<b-btn type="reset" variant="outline-secondary" class="mr-2" @click="hideModal">Cancel</b-btn>
<b-btn type="submit" variant="primary" @click="updateContact()">Update</b-btn>
</div>
</div>
</b-modal>
</template>
<script>
import axios from 'axios'
export default {
data () {
return {
form: {
id: this.id,
email: this.email,
phone: this.phone,
linkedin_profile: this.linkedin_profile
}
}
},
methods: {
focusMyElement (e) {
this.$refs.focusThis.focus()
},
hideModal () {
this.$root.$emit('bv::hide::modal','editContactInfo')
},
//UpdateConnection for Contact Information
updateContact () {
axios.put(`http://localhost:5000/api/contacts/${this.id}`,
{
id: this.form.id,
phone: this.form.phone,
linkedin_profile: this.form.linkedin_profile })
.then((res) => {
this.form.id = ''
this.form.phone = ''
this.form.linkedin_profile = ''
console.log(res)
})
.catch((err) => {
console.log(err)
})
}
}
}
</script>
api
// Update contact
router.put("/:id", (req, res) => {
if (!req.body.phone,
!req.body.linkedin_profile) {
res.status(400)
res.json({
error: "Bad Data"
})
} else {
Contact.update(
{ phone: req.body.phone,
linkedin_profile: req.body.linkedin_profile},
{ where: { id: req.params.id } }
)
.then(() => {
res.send("Contact updated")
})
.error(err => res.send(err))
}
})