最受欢迎的三方库之china_area

举报
童长老 发表于 2025/06/25 15:04:17 2025/06/25
【摘要】 china_area 🏆简介与推荐china_area 中国区域数据,省市县三级数据。harmony-utils一款功能丰富且极易上手的HarmonyOS工具库,借助众多实用工具类,致力于助力开发者迅速构建鸿蒙应用。harmony-dialog一款极为简单易用的零侵入弹窗,仅需一行代码即可轻松实现,无论在何处都能够轻松弹出。 🌞下载安装ohpm i @nutpi/china_areaO...

china_area

🏆简介与推荐

china_area 中国区域数据,省市县三级数据。

harmony-utils 一款功能丰富且极易上手的HarmonyOS工具库,借助众多实用工具类,致力于助力开发者迅速构建鸿蒙应用。

harmony-dialog 一款极为简单易用的零侵入弹窗,仅需一行代码即可轻松实现,无论在何处都能够轻松弹出。

🌞下载安装

ohpm i @nutpi/china_area
OpenHarmony ohpm
环境配置等更多内容,请参考如何安装 OpenHarmony ohpm 包

📚API详解 使用案例

AreaHelper方法 介绍
getAreaStrSync
getAreaStr
获取省市县的JSON字符串
getAreaSync
getArea
获取省市县的数据
getCityByNameSync
getCityByName
根据省名获取下面的市
getDistrictByNameSync
getDistrictByName
根据市名获取下面的区县

📚示例代码

//获取省市县的JSON字符串
let txtStr = await AreaHelper.getAreaStr();
let areaList = JSONUtil.jsonToArray<AreaEntity>(txtStr);


//获取省市县的数据
let areas = AreaHelper.getAreaSync();


//根据省名获取下面的市
let citys = await AreaHelper.getCityByName("安徽省");


//根据市名获取下面的区县
let list = AreaHelper.getDistrictByNameSync("合肥市");


//配合‘@pura/harmony-dialog’的\nshowTextPickerDialog()方法使用
let data = AreaHelper.getAreaSync();
DialogHelper.showTextPickerDialog({
  title: "请选择",
  range: data,
  onChange: (value: string | string[], index: number | number[]) => {
    LogUtil.error(`value: ${value} --- index: ${index}`);
  },
  onAction: (action: number, dialogId: string, value: string | string[]) => {
    if (action === DialogAction.SURE) {
      DialogHelper.showToast(`已选择:${value}`);
    }
  }
});
import { router } from '@kit.ArkUI';
import { AreaEntity, AreaHelper } from '@nutpi/china_area';
import { JSONUtil, LogUtil, StrUtil } from '@pura/harmony-utils';
import { TitleBarView } from '../../component/TitleBarView';
import { DescribeBean } from '../../model/DescribeBean';
import { JSON } from '@kit.ArkTS';
import { DialogAction, DialogHelper } from '@pura/harmony-dialog';

/**
 * @nutpi/china_area,使用案例
 */
@Entry
@ComponentV2
export struct ChinaAreaPage {
  private scroller: Scroller = new Scroller();
  @Local describe: DescribeBean = router.getParams() as DescribeBean;
  @Local txtStr: string = "";


  build() {
    Column() {
      TitleBarView({ describe: this.describe })
      Divider()
      Scroll(this.scroller) {
        Column({ space: 5 }) {
          Button("getAreaStr()")
            .btnStyle()
            .onClick(async () => {
              this.txtStr = await AreaHelper.getAreaStr();
              let data = JSONUtil.jsonToArray<AreaEntity>(this.txtStr);
              DialogHelper.showToast(`${data.length}`);
            })
          Button("getAreaStr()")
            .btnStyle()
            .onClick(async () => {
              let list = await AreaHelper.getArea();
              LogUtil.error(`长度:${list.length}`);
              this.txtStr = JSON.stringify(list,null,2);
            })
          Button("getCityByName()")
            .btnStyle()
            .onClick(async () => {
              let citys = await AreaHelper.getCityByName("安徽省");
              this.txtStr = JSON.stringify(citys, null, 2);
            })
          Button("getDistrictByNameSync()")
            .btnStyle()
            .onClick(() => {
              let list = AreaHelper.getDistrictByNameSync("合肥市");
              this.txtStr = JSON.stringify(list, null, 2);
            })
          Button("配合‘@pura/harmony-dialog’的\nshowTextPickerDialog()方法使用")
            .labelStyle({ maxLines: 3 })
            .padding({ top: 10, bottom: 10 })
            .btnStyle()
            .onClick(() => {
              this.txtStr = "";
              let data = AreaHelper.getAreaSync();
              DialogHelper.showTextPickerDialog({
                title: "请选择",
                range: data,
                onChange: (value: string | string[], index: number | number[]) => {
                  LogUtil.error(`value: ${value} --- index: ${index}`);
                },
                onAction: (action: number, dialogId: string, value: string | string[]) => {
                  if (action === DialogAction.SURE) {
                    DialogHelper.showToast(`已选择:${value}`);
                  }
                }
              });
            })

          Blank().layoutWeight(1)

          Text(this.txtStr)
            .visibility(StrUtil.isNotEmpty(this.txtStr) ? Visibility.Visible : Visibility.None)
            .textStyle()

          Blank().layoutWeight(1)
        }
        .margin({ top: 5, bottom: 5 })
      }
      .layoutWeight(1)
    }
    .width('100%')
    .height('100%')
    .backgroundColor($r('app.color.main_background'))
  }
}


@Styles
function btnStyle() {
  .width('90%')
  .margin({ top: 10, bottom: 5 })
}

@Styles
function textStyle() {
  .width('95%')
  .padding(10)
  .shadow(ShadowStyle.OUTER_DEFAULT_XS)
  .margin({ top: 5, bottom: 10 })
  .border({
    width: 1,
    color: Color.Grey,
    radius: 10,
    style: BorderStyle.Dashed
  })
}

🍎沟通与交流🙏

使用过程中发现任何问题都可以提 Issue给我们;
当然,我们也非常欢迎你给我们发 PR

🌏开源协议

本项目基于 [Apache License 2.0] ,在拷贝和借鉴代码时,请大家务必注明出处。

【声明】本内容来自华为云开发者社区博主,不代表华为云及华为云开发者社区的观点和立场。转载时必须标注文章的来源(华为云社区)、文章链接、文章作者等基本信息,否则作者和本社区有权追究责任。如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱: cloudbbs@huaweicloud.com
  • 点赞
  • 收藏
  • 关注作者

评论(0

0/1000
抱歉,系统识别当前为高风险访问,暂不支持该操作

全部回复

上滑加载中

设置昵称

在此一键设置昵称,即可参与社区互动!

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。