VUE怎么实现提交一条数据,页面更新
粉丝福利 : 关注VUE中文社区公众号,回复视频领取粉丝福利
这种提交一个地址,提交之后,数据存储进去了,但是怎么在200之后页面更新,显示刚刚提交的数据
<mu-text-field hintText="收货人" type="text" v-model="add.consignee" fullWidth :error-text="showError('consignee')" style="margin-top:14px;"/>
<mu-text-field hintText="联系电话" type="number" v-model="add.phone" fullWidth :error-text="showError('phone')"/>
<mu-text-field hintText="详细地址" v-model="add.address" :errorText="multiLineInputErrorText || showError('address')" [@textOverflow](/user/textOverflow)="handleMultiLineOverflow" multiLine :rows="2" :rowsMax="6" :maxLength="40" :error-text="showError('address')" fullWidth/>
<mu-switch label="设为默认地址" labelLeft class="demo-switch" [@change](/user/change)="switchIsCurrent" :value="!!add.is_current" fullWidth/>
<mu-raised-button label="保存" class="demo-raised-button st-fixed fullHeight" primary fullWidth backgroundColor="#FF4E4E" [@click](/user/click)="submit"/>
<yd-popup v-model="show2" position="bottom" height="70%" >
<v-areas [@close](/user/close)="Areasclose" v-on:listen="getD"/>
</yd-popup>
<input type="hidden" class="mu-text-field-input" readonly :value="add.area_id" placeholder="选择地址">
<input type="number" class="mu-text-field-input" readonly :placeholder="addres" disabled="" :error-text="showError('area_id')"/>
地址不能为空。
提交数据
submit(){
Auth.then( auth=> {
Ajaxy.post( ${configs.catShop.apiBaseUrl}addresses
, this.add, { token: auth.token, } )
.when( 200, response=> {
this.errors= {};
this.response = response.json;
this.$emit(‘close’);
})
.when(409, response=> {
this.errors= {};
this.response = response.json;
this.$emit(‘close’);
})
.when( 422, response=> this.errors= response.json )
.when( 401, response=> Auth.refreshToken().then( ()=>this.submit() ) )
;
} );
},