Choose city-Mobile Platform as a Service(mPaaS)-阿里云帮助中心

my.chooseCity

Opens the city selection list.

To retrieve reverse geocoding information on iOS, set the Amap location key in the beforeDidFinishLaunchingWithOptions method as shown below. For more information about how to obtain an Amap location key, see Get Key.

[LBSmPaaSAdaptor sharedInstance].shouldAMapRegeoWhenLBSFailed = YES;
[AMapServices sharedServices].apiKey = @"Your Amap location key"

Input parameters

The input parameter is an object with the following properties:

Name	Type	Required	Description
showLocatedCity	Boolean	No	Specifies whether to display the current city. Default value: false.
showHotCities	Boolean	No	Specifies whether to display popular cities. Default value: true.
setLocatedCity	Boolean	No	Specifies whether to allow changing the current city. Default value: false. This setting takes effect only when `showLocatedCity` is set to true.
cities	Object Array	No	A custom city list. For the object fields, see the "Custom city list: cities" table below.
hotCities	Object Array	No	A custom list of popular cities. The object fields are the same as those for `cities`.
success	Function	No	Callback function invoked on a successful call.
fail	Function	No	Callback function invoked on a failed call.
complete	Function	No	Callback function invoked when the call completes, regardless of success or failure.

Custom city list: cities

The cities object contains the following fields:

Name	Type	Required	Description
city	String	Yes	The city name.
adCode	String	Yes	The administrative region code.
spell	String	Yes	The Pinyin spelling of the city name, used for search.

Code example:

// .js
my.chooseCity({
  cities: [
    {
      city: 'Chaoyang District',
      adCode: '110105',
      spell: 'chaoyang'
    },
    {
      city: 'Haidian District',
      adCode: '110108',
      spell: 'haidian'
    },
    {
      city: 'Fengtai District',
      adCode: '110106',
      spell: 'fengtai'
    },
    {
      city: 'Dongcheng District',
      adCode: '110101',
      spell: 'dongcheng'
    },
    {
      city: 'Xicheng District',
      adCode: '110102',
      spell: 'xicheng'
    },
    {
      city: 'Fangshan District',
      adCode: '110111',
      spell: 'fangshan'
    }
  ],
  hotCities: [
    {
      city: 'Chaoyang District',
      adCode: '110105'
    },
    {
      city: 'Haidian District',
      adCode: '110108'
    },
    {
      city: 'Fengtai District',
      adCode: '110106'
    }
  ],
  success: (res) => {
    my.alert({
      content: res.city + ':' + res.adCode
    });
  },
});

Success return value

Note

If the user does not select a city and taps Back, the callback function is not triggered.

The return value is an object with the following properties:

Property	Type	Description
city	String	The city name.
adCode	String	The administrative region code.
longitude	Number	The longitude. Returned only for the current city.
latitude	Number	The latitude. Returned only for the current city.

Code example

<!-- API-DEMO page/API/choose-city/choose-city.axml -->
<view class="page">
  <view class="page-description">Choose City API</view>
  <view class="page-section">
    <view class="page-section-title">my.chooseCity</view>
    <view class="page-section-demo">
      <button type="primary" onTap="chooseCity">Choose City</button>
    </view>
  </view>
  <view class="page-description">Change Current City Name API</view>
  <view class="page-section">
    <view class="page-section-title">my.setLocatedCity</view>
    <view class="page-section-demo">
      <button type="primary" onTap="setLocatedCity">Change Current City Name</button>
    </view>
  </view>
</view>

// API-DEMO page/choose-city/choose-city.js
Page({
  chooseCity() {
    my.chooseCity({
      showLocatedCity: true,
      showHotCities: true,
      success: (res) => {
        my.alert({
          title: 'chooseCity response: ' + JSON.stringify(res),
        });
      },
    });
  },
  setLocatedCity() {
    my.onLocatedComplete({
      success: (res) => {
        my.setLocatedCity({
          locatedCityId:res.locatedCityId,//res.locatedCityId
          locatedCityName:'Modified city name', 
          success: (res) => {
            my.alert({ content: 'Successfully changed the current city: ' + JSON.stringify(res), });
          },
          fail: (error) => {
            my.alert({ content: 'Failed to change the current city: ' + JSON.stringify(error), });
          },
        });
      },
      fail: (error) => {
        my.alert({ content: 'onLocatedComplete failed: ' + JSON.stringify(error), });
      }
    });
    my.chooseCity({
      showLocatedCity: true,
      showHotCities: true,
      setLocatedCity: true,
      success: (res) => {
        my.alert({
          title: 'chooseCity response: ' + JSON.stringify(res),
        });
      },
    });
  },
});

my.onLocatedComplete

Listens for the callback after the geographical location is determined. This applies only when setLocatedCity in my.chooseCity is set to true.

Input parameters

Name	Type	Description
success	Function	Callback function invoked on a successful call.
fail	Function	Callback function invoked on a failed call.
complete	Function	Callback function invoked when the call completes, regardless of success or failure.

Return value

Name	Type	Description
longitude	Number	The longitude of the current city.
latitude	Number	The latitude of the current city.
locatedCityId	String	The ID of the current city. Pass this ID when calling `setLocatedCity`.

Return value example:

{
    longitude:100.3,
    latitude:30.1,
    locatedCityId:""
}

Code example

<!-- API-DEMO page/API/choose-city/choose-city.axml -->
<view class="page">
  <view class="page-description">Choose City API</view>
  <view class="page-section">
    <view class="page-section-title">my.chooseCity</view>
    <view class="page-section-demo">
      <button type="primary" onTap="chooseCity">Choose City</button>
    </view>
  </view>
  <view class="page-description">Change Current City Name API</view>
  <view class="page-section">
    <view class="page-section-title">my.setLocatedCity</view>
    <view class="page-section-demo">
      <button type="primary" onTap="setLocatedCity">Change Current City Name</button>
    </view>
  </view>
</view>

// API-DEMO page/choose-city/choose-city.js
Page({
  chooseCity() {
    my.chooseCity({
      showLocatedCity: true,
      showHotCities: true,
      success: (res) => {
        my.alert({
          title: 'chooseCity response: ' + JSON.stringify(res),
        });
      },
    });
  },
  setLocatedCity() {
    my.onLocatedComplete({
      success: (res) => {
        my.setLocatedCity({
          locatedCityId:res.locatedCityId,//res.locatedCityId
          locatedCityName:'Modified city name', 
          success: (res) => {
            my.alert({ content: 'Successfully changed the current city: ' + JSON.stringify(res), });
          },
          fail: (error) => {
            my.alert({ content: 'Failed to change the current city: ' + JSON.stringify(error), });
          },
        });
      },
      fail: (error) => {
        my.alert({ content: 'onLocatedComplete failed: ' + JSON.stringify(error), });
      }
    });
    my.chooseCity({
      showLocatedCity: true,
      showHotCities: true,
      setLocatedCity: true,
      success: (res) => {
        my.alert({
          title: 'chooseCity response: ' + JSON.stringify(res),
        });
      },
    });
  },
});undefined

my.setLocatedCity

Changes the displayed name of the current city in my.chooseCity.

Input parameters

Name	Type	Required	Description
locatedCityId	String	Yes	The ID of the current city, returned by `onLocatedComplete` of `my.chooseCity`.
locatedCityName	String	Yes	The name of the current city.
locatedCityAdCode	String	No	The administrative region code of the current city. If not specified, the default value obtained by the component is used.
locatedCityPinyin	String	No	The Pinyin of the current city. If not specified, the default value obtained by the component is used.
success	Function	No	Callback function invoked on a successful call.
fail	Function	No	Callback function invoked on a failed call.
complete	Function	No	Callback function invoked when the call completes, regardless of success or failure.

Fail return value

Name	Type	Description
error	String	The error code.
errorMessage	String	The error description.

Success return value

Name	Type	Description
locatedCityName	String	The name of the current city.

Error codes

Error code	Description	Solution
11	Incorrect parameter type.	Check whether the parameter type is correct.
12	A required parameter is empty.	Make sure the `locatedCityId` and `locatedCityName` parameters are specified.
13	The locatedCityId does not match.	Make sure the value matches the `locatedCityId` returned by `onLocatedComplete` of `my.chooseCity`.

Code example

<!-- .axml -->
<view class="page">
  <view class="page-description">Choose City</view>
  <view class="page-section">
    <view class="page-section-title">chooseCity</view>
    <view class="page-section-demo">
      <button type="primary" onTap="chooseCity">Choose City</button>
      <button type="primary" onTap="noChooseCity">No Popular/Current Cities</button>
      <button type="primary" onTap="selfChooseCity">Custom Cities for Selection</button>
      <button type="primary" onTap="self_chooseCity">Custom Cities for Selection</button>
      <button type="primary" onTap="setLocatedCity">setLocatedCity</button>
    </view>
  </view>
</view>

// .js
Page({
  data: {
    localcity: 'Tianjin',
  },
  chooseCity() {
    my.chooseCity({
      showLocatedCity: true,
      showHotCities: true,
      success: (res) => {
        my.alert({ title: `chooseAlipayContact response: ${JSON.stringify(res)}` })
      },
      fail: (error) => {
        my.alert({ content: `Selection failed: ${JSON.stringify(error)}` })
      },
      complete: () => {
        my.showToast({ content: 'complete callback' })
      },
    })
  },
  noChooseCity() {
    my.chooseCity({
      showLocatedCity: false,
      showHotCities: false,
      success: (res) => {
        my.alert({ title: `Operation successful: ${JSON.stringify(res)}` })
      },
      fail: (error) => {
        my.alert({ content: `Selection failed: ${JSON.stringify(error)}` })
      },
    })
  },
  selfChooseCity() {
    my.chooseCity({
      cities: [
        {
          city: 'Chaoyang District',
          adCode: '110105',
          spell: 'chaoyang',
        },
        {
          city: 'Haidian District',
          adCode: '110108',
          spell: 'haidian',
        },
        {
          city: 'Fengtai District',
          adCode: '110106',
          spell: 'fengtai',
        },
        {
          city: 'Dongcheng District',
          adCode: '110101',
          spell: 'dongcheng',
        },
        {
          city: 'Xicheng District',
          adCode: '110102',
          spell: 'xicheng',
        },
        {
          city: 'Fangshan District',
          adCode: '110111',
          spell: 'fangshan',
        },
      ],
      hotCities: [
        {
          city: 'Chaoyang District',
          adCode: '110105',
        },
        {
          city: 'Haidian District',
          adCode: '110108',
        },
        {
          city: 'Fengtai District',
          adCode: '110106',
        },
      ],
      success: (res) => {
        my.alert({ title: `Operation successful: ${JSON.stringify(res)}` })
      },
      fail: (error) => {
        my.alert({ content: `Selection failed: ${JSON.stringify(error)}` })
      },
    })
  },

  self_chooseCity() {
    my.chooseCity({
      showLocatedCity: true,
      showHotCities: true,
      cities: [
        {
          city: 'Chaoyang District',
          adCode: '110105',
          spell: 'chaoyang',
        },
        {
          city: 'Haidian District',
          adCode: '110108',
          spell: 'haidian',
        },
        {
          city: 'Fengtai District',
          adCode: '110106',
          spell: 'fengtai',
        },
        {
          city: 'Dongcheng District',
          adCode: '110101',
          spell: 'dongcheng',
        },
        {
          city: 'Xicheng District',
          adCode: '110102',
          spell: 'xicheng',
        },
      ],
      hotCities: [
        {
          city: 'Chaoyang District',
          adCode: '110105',
        },
        {
          city: 'Haidian District',
          adCode: '110108',
        },
        {
          city: 'Fengtai District',
          adCode: '110106',
        },
      ],
      success: (res) => {
        my.alert({ title: `Operation successful: ${JSON.stringify(res)}` })
      },
      fail: (error) => {
        my.alert({ content: `Selection failed: ${JSON.stringify(error)}` })
      },
    })
  },

  multiLevelSelect() {
    my.multiLevelSelect({
      title: 'Please select a city', // Title of the cascaded selection
      list: [
        {
          name: 'Hangzhou City', // Item name
          subList: [
            {
              name: 'Xihu District',
              subList: [
                {
                  name: 'Wenyi Road',
                },
                {
                  name: 'Wener Road',
                },
                {
                  name: 'Wensan Road',
                },
              ],
            },
            {
              name: 'Binjiang District',
              subList: [
                {
                  name: 'Binhe Road',
                },
                {
                  name: 'Binxing Road',
                },
                {
                  name: 'Baima Lake Animation Plaza',
                },
              ],
            },
          ], // Cascaded sub-data list
        },
      ],
      success: (result) => {
        console.log(result)
        my.alert({ content: `Cascade ${JSON.stringify(result)}` })
      },
      fail: (error) => {
        my.alert({ content: `Call failed: ${JSON.stringify(error)}` })
      },
    })
  },

  setLocatedCity() {
    my.chooseCity({
      showLocatedCity: true,
      showHotCities: true,
      setLocatedCity: true,
      success: (res) => {
        this.setData({
          localcity: res.city,
        })
        my.alert({ title: `chooseAlipayContact response: ${JSON.stringify(res)}` })
      },
      fail: (error) => {
        my.alert({ content: `Selection failed: ${JSON.stringify(error)}` })
      },
      complete: () => {
        my.showToast({ content: 'complete callback' })
      },
    })
    my.onLocatedComplete({
      success: (res) => {
        my.setLocatedCity({
          locatedCityId: res.locatedCityId,
          locatedCityName: this.data.localcity,
          success: (result) => {
            console.log(result)
          },
          fail: (error) => {
            my.alert({
              content: `Failed to change the current city: ${JSON.stringify(error)}`,
            })
          },
        })
      },
      fail: (error) => {
        my.alert({
          content: `onLocatedComplete failed: ${JSON.stringify(error)}`,
        })
      },
    })
  },
})