全国地址4级联动，数据是json格式下载链接https://download.csdn.net/download/weixin_54617585/85860744

创建vue组件

<template>

    <view class="area-container">

        <h1 class="title">选择地区</h1>

        <ul class="name-list">

            <li :class="showIndex==0?'select':''" @click="anewSelect(0)">{ {province.name}}</li>

            <li :class="showIndex==1?'select':''" @click="anewSelect(1)">{ {city.name}}</li>

            <li :class="showIndex==2?'select':''" @click="anewSelect(2)">{ {area.name}}</li>

            <li :class="showIndex==3?'select':''" @click="anewSelect(3)">{ {street.name}}</li>

        </ul>

        <ul v-if="showIndex==0" class="content" :style="'height:'+ heightCot + 'upx'">

            <li @click="selectPro(index,item.ext_name,item.code)" v-for="(item,index) in provinceData" :key="index">

                { {item.ext_name}}

            </li>

        </ul>

        <ul v-if="showIndex==1" class="content" :style="'height:'+ heightCot + 'upx'">

            <li @click="selectCity(index,item.ext_name,item.code)" v-for="(item,index) in cityData" :key="index">

                { {item.ext_name}}

            </li>

        </ul>

        <ul v-if="showIndex==2" class="content" :style="'height:'+ heightCot + 'upx'">

            <li @click="selectaArea(index,item.ext_name,item.code)" v-for="(item,index) in areaData" :key="index">

                { {item.ext_name}}

            </li>

        </ul>

        <ul v-if="showIndex==3" class="content" :style="'height:'+ heightCot + 'upx'">

            <li @click="selectStreet(index,item.ext_name,item.code)" v-for="(item,index) in streetsData" :key=&#