老师帮忙看一下,为啥会报错呢
来源:12-5 新增地址交互实现

小杨同学呀
2021-01-13
我只要在姓名栏一输入就报错
4回答
-
河畔一角
2021-01-13
你的checkItem对象里面没有定义receiveName和手机号等信息,在data里面加一下
012021-01-13 -
小杨同学呀
提问者
2021-01-13
<script>
import Modal from './../components/Modal'
export default {
name: 'order-confirm',
components: {
Modal,
},
data() {
return {
list: [],
cartList:[],
cartTotalPrice: 0,
count: 0,
checkedItem:{},
userAction: '',
showDelModal: false,
showEditModal:false,
}
},
mounted() {
this.getAddressList()
this.getCartList()
},
methods: {
getAddressList() {
this.axios.get('/shippings').then((res) => {
this.list = res.list
})
},
openAddressModal(){
this.userAction = 0;
this.checkedItem = '';
this.showEditModal = true;
},
delAddress(item) {
this.checkedItem = item
this.userAction = 2
this.showDelModal = true
},
//地址删除编辑新增功能
submitAddress() {
let { checkedItem, userAction } = this
let method,url,params={};
if (userAction == 0) {
method = 'post';
url = '/shippings';
} else if (userAction == 1) {
method = 'put';
url = `/shippings/${checkedItem.id}`;
} else {
method = 'delete';
url = `/shippings/${checkedItem.id}`;
}
if(userAction == 0 || userAction == 1){
let { receiverName, receiverMobile, receiverProvince, receiverCity, receiverDistrict, receiverAddress, receiverZip } = checkedItem;
let errMsg = '';
if(!receiverName){
errMsg = '请输入收货人名称'
}else if(!receiverMobile || !/\d{11}/.test(receiverMobile)){
errMsg = '请输入手机号'
}else if(!receiverProvince){
errMsg ='请选择对应的省份'
}else if(!receiverCity){
errMsg ='请选择对应的城市'
}else if(!receiverDistrict || !receiverAddress){
errMsg ='请选择对应的街道'
}else if(!receiverZip || !/\d{6}/.test(receiverZip)){
errMsg ='请选择对应御品哦'
}
if(errMsg){
this.$message.error(errMsg)
return;
}
params = {
receiverName,
receiverMobile,
receiverProvince,
receiverCity,
receiverDistrict,
receiverAddress,
receiverZip
}
}
this.axios[method](url,params).then(() => {
this.closeModal()
this.getAddressList()
this.$message.success('操作成功')
})
},
closeModal() {
this.checkedItem = {}
this.userAction = ''
this.showDelModal = false
},
getCartList() {
this.axios.get('/carts').then((res) => {
let list = res.cartProductVoList
this.cartTotalPrice = res.cartTotalPrice
this.cartList = list.filter((item) => item.productSelected)
this.cartList.map((item) => {
this.count += item.quantity
})
})
},
},
}
</script>
00 -
小杨同学呀
提问者
2021-01-13
<modal title="新增确认" btnType="1" :showModal="showEditModal" @cancel="showEditModal=false" @submit="submitAddress">
<template v-slot:body>
<div class="edit-wrap">
<div class="item">
<input type="text" class="input" placeholder="姓名" v-model="checkedItem.receiverName">
<input type="text" class="input" placeholder="手机号" v-model="checkedItem.receiverMobile">
</div>
<div class="item">
<select name="provice" v-model="checkedItem.receiverProvince">
<option value="北京">北京市</option>
<option value="田间">天津</option>
<option value="黑背">河北省</option>
</select>
<select name="city" v-model="checkedItem.receiverCity">
<option value="北京">北京市</option>
<option value="田间">天津</option>
<option value="张家口">张家口</option>
</select>
<select name="district" v-model="checkedItem.receiverDistrict">
<option value="朝阳区">朝阳区</option>
<option value="海淀区">海淀区</option>
<option value="东城区">东城区</option>
</select>
</div>
<div class="item">
<textarea name="street" v-model="checkedItem.receiverAddress"></textarea>
</div>
<div class="item">
<input type="text" class="input" placeholder="邮编" v-model="checkedItem.receiverZip">
</div>
</div>
</template>
</modal>
00 -
河畔一角
2021-01-13
贴一下orderConfirm组件的代码
012021-01-13
相似问题