vant地址编辑回显,vant-list,vant list offset,vant tab list,vant-cli,vant search
Vant4 AddressList 是一个基于 Vue.js 的 UI 组件，用于展示地址列表。该组件提供了可定制的选项和事件处理程序，使用户能够轻松地创建一个具有良好交互性的地址列表。

该组件可以接受一个数组作为输入，每个元素都代表一个地址对象，包含了地址的详细信息（如国家、省份、城市、街道、邮政编码等）。这些信息可以通过插槽进行自定义渲染，也可以通过配置参数进行样式定制。

下面是一个简单的 Vant4 AddressList 组件的例子：

html
<template>
<van-address-list :list="addressList" @select="onAddressSelect"></van-address-list>
</template>

<script>
export default {
data() {
return {
addressList: [
{
name: '张三',
tel: '13800138000',
address: '北京市朝阳区望京SOHO塔3B座101室',
isDefault: true,
},
{
name: '李四',
tel: '13900139000',
address: '上海市浦东新区世纪大道100号',
isDefault: false,
},
],
};
},
methods: {
onAddressSelect(address) {
console.log('Selected address:', address);
},
},
};
</script>


在这个例子中，我们定义了一个包含两个地址对象的地址列表，并将其传递给 Vant4 AddressList 组件进行渲染。同时，我们还监听了 select 事件，在用户选择一个地址时会触发该事件，并将所选的地址对象作为参数传递给回调函数 onAddressSelect。