uniapp➕uview

＊＊＊于Vue.js开发的跨平台应用框架，可以使用Vue.js语法开发一次代码，同时发布到多个平台，如iOS、Android、H5等。uView是一个基于uniapp框架的UI组件库，提供了丰富的组件和样式，可以快速搭建uniapp应用的UI界面。

使用uView组件实现省市区三级联动的步骤如下：
1. 在项目中引入uView组件，可以通过npm安装或者下载源码后手动引入。
2. 在需要使用省市区三级联动的页面中，引入uView提供的`area`组件。
3. 在`area`组件中设置`:list`属性为省市区数据，可以通过引入数据文件或者通过接口获取数据。
4. 在`area`组件中设置`@change`事件，当用户选择完省市区后，会触发该事件，可以在事件处理函数中获取用户选择的省市区信息。

以下是一个使用uView组件实现省市区三级联动的示例代码：

<template>
  <view>
    <u-area :list="areaList" @change="onChange"></u-area>
  </view>
</template>

<script>
import uArea from '@/components/uview-ui/components/u-area/u-area.vue'
export default {
  components: {
    uArea
  },
  data() {
    return {
      areaList: [] // 省市区数据
    }
  },
  mounted() {
    // 通过接口获取省市区数据
    this.getAreaList()
  },
  methods: {
    getAreaList() {
      // 发送接口请求获取省市区数据
      // 省市区数据格式如下：
      // [
      //   {
      //     "name": "北京市",
      //     "code": "110000",
      //     "sub": [
      //       {
      //         "name": "市辖区",
      //         "code": "110100",
      //         "sub": [
      //           {
      //             "name": "东城区",
      //             "code": "110101"
      //           },
      //           ...
      //         ]
      //       },
      //       ...
      //     ]
      //   },
      //   ...
      // ]
      this.areaList = areaData // 将获取到的省市区数据赋值给areaList
    },
    onChange(val) {
      // 用户选择完省市区后，会触发该事件，val为用户选择的省市区信息
      console.log(val)
    }
  }
}
</script>