1、关于地区选择：AddressList 地址列表

<template> <div class="address"> <nav-bar :if_left_arrow="true" title="收货地址"></nav-bar> <van-address-list v-model="active_id" :list="list" add-button-text="+添加地址" @select="click_active" @add="$router.push('add_address')" @edit="onEdit" /> <no-data type="1" v-show="!dataShow"></no-data> </div> </template> <script> export default { data() { return { dataShow:true, active_id: '',//默认地址id list: [],//列表数据 } }, mounted() { this.axios.post('/api/Ucenter/my_address').then(res=>{ if(res.status == 1){ if(res.data.address.length == 0){ this.dataShow = false;//没有数据 }else{ this.dataShow = true; res.data.address.forEach((item,i)=>{ this.list.push({ id:item.id, name:item.consigner, tel:item.phone, address:item.address_detail, address_code:item.address_code, is_default:item.is_default, add:item.address, }) //默认选择 if(item.is_default == 1){ this.active_id = item.id } }) } } }) }, methods: { //点击列表 click_active(item,index){ this.axios.post('/api/Ucenter/default_address',{ address_id:item.id, }).then(res=>{ if(res.status == 1){ this.active_id = item.id; } }) }, //点击编辑地址 onEdit(item) { this.$router.push({ name:'address_modify', params:{ item:item } }) }, }, } </script> <style scoped lang="less"> .address { min-height: 100vh; background: @bgColor; /deep/.van-address-list{ margin-top: 5px; .van-address-item .van-radio__icon--checked .van-icon{ background: @mainColor; border-color: @mainColor; } .van-button--danger{ background: @mainColor; } } } </style>