插件介绍

        腾讯位置服务城市选择器插件可以让用户快速、准确地选择城市，并将城市信息回传给开发者。我们的插件提供单页模式和组件模式两种形式，并支持搜索和索引等功能。

接入指引

1、插件申请接入：

        在腾讯公众平台中， “微信小程序官方后台-设置-第三方服务-插件管理” 里点击 “添加插件”，搜索 “腾讯位置服务城市选择器” 申请，申请后小程序开发者可在小程序内使用该插件。

2、引入插件包： 地图选点appId： wx63ffb7b7894e99ae （点击浏览插件最新版本）

// app.json
{
    "plugins": {
        "citySelector": {
             "version": "1.0.2",
             "provider": "wx63ffb7b7894e99ae"
         }
    }
}  

3、设置定位授权：

        城市选择器插件需要小程序提供定位授权才能够正常使用定位功能：

// app.json
{
    "permission": {
        "scope. userFuzzyLocation": {
        "desc": "你的位置信息将用于小程序定位"
        }
    }
}

4、使用插件的页面模式：

插件调用示例：

const key = ''; // 使用在腾讯位置服务申请的key
const referer = ''; // 调用插件的app的名称
const hotCitys = ''; // 用户自定义的的热门城市

wx.navigateTo({
  url: `plugin://citySelector/index?key=${key}&referer=${referer}&hotCitys=${hotCitys}`,
})

插件参数说明

        插件页面参数

插件接口调用示例：

const citySelector = requirePlugin('citySelector');
Page({
  // 从城市选择器插件返回后，在页面的onShow生命周期函数中能够调用插件接口，获取cityInfo结果对象
  onShow() {
    const selectedCity = citySelector.getCity(); // 选择城市后返回城市信息对象，若未选择返回null
  },
  onUnload () {
    // 页面卸载时清空插件数据，防止再次进入页面，getCity返回的是上次的结果
    citySelector.clearCity();
  }
})

插件接口返回的城市信息对象的说明（cityInfo）

        location 对象说明

5、使用插件的组件模式：

组件调用示例：

        在需要使用城市选择器组件的页面 json 文件中注册该组件

// page.json
{
  "usingComponents": {
    "selector-component": "plugin://citySelector/selector-component"
  }
}

        在小程序页面内使用

<!-- page.wxml -->
<!-- key、referer和hotCitys通过组件的属性传入 -->
<selector-component
  show="{{selectorVisible}}"
  key=""
  referer=""
  hotCitys=""
  bindselect="onSelectCity"
></selector-component>

// page.js
Page({
  data: {
    selectorVisible: false,
    selectedProvince: null,
    selectedCity: null,
  },

  // 显示组件
  showSelector() {
    this.setData({
      selectorVisible: true,
    });
  },

  // 当用户选择了组件中的城市之后的回调函数
  onSelectCity(e) {
    const { province, city } = e.detail;
    this.setData({
      selectedProvince: province,
      selectedCity: city,
    });
  },
})

组件属性说明：

插件错误处理

     插件页面传递参数错误处理说明：

• 当必传参数没有传时，插件页面内容不展示

     页面错误码列表：

效果图

页面模式效果图：

Head	Head

组件模式效果图：

Head	Head