# SWXAddress
> 国内 省市区三级数据。 数据基于`china-area-data`修改。

### 引入

```js
import { SWXAddress } from '@sweetui/sweet-weex-ui'
```
由于`weex`不支持 `Vue.components`，在.vue中注册
```js
  export default {
    components: {
      SWXAddress,
    },
  }
```
### 使用

```vue

  <SWXButton @onClick="openAddress">选择地址</SWXButton>
  <SWXAddress :value="address" ref="swAddress" @onInput="addressInput"></SWXAddress>
  
<script>
    import { SWXButton, SWXAddress } from '@sweexui/sweex-ui'
  
    export default {
      components: {
        SWXButton,
        SWXAddress,
      },
      data() {
        return {
          address: []
        }
      },
      methods: {
        /**
         * 确定事件
         */
        addressInput(result) {
          this.address = result
        },
        /**
         * 选择地址
         */
        openAddress() {
          this.$refs.swAddress.show()
        }
      }
    }
</script>
```
<strong>组件最好放最后，因为weex不支持z-index属性，靠后的元素，层级高</strong>
### Props
| 参数          | 说明            | 类型            | 可选值                 | 默认值   |
|-------------  |---------------- |---------------- |---------------------- |-------- |
| value         | 值		  | Array  | - | - |
| showIndex         | 是否显示 字母索引		  | Boolean  | true/false | true |
| showHot         | 是否显示热门城市，level=1时无效		  | Boolean  | true/false | true |
| level         | 显示的级别数,1 -> 省，热门会被隐藏 2 -> 省市 3 -> 省市区	| Number  |1/2/3| 按钮 |

<strong>value: [{"id":330000,"label":"浙江省"},{"id":330100,"label":"杭州市"}]</strong>

### Events
| 事件名称          | 说明            | 参数值 |
|-------------  |---------------- | ---- |
|onInput	  | 确定事件 |  value值 |
|onCancel	  | 取消事件 | event对象  |