{"id":13459160,"url":"https://github.com/TerryZ/v-region","last_synced_at":"2025-03-24T16:31:27.112Z","repository":{"id":33494947,"uuid":"133921584","full_name":"TerryZ/v-region","owner":"TerryZ","description":"提供 5 种应用形式的 4 级行政区划选择器 A simple region cascade selector, provide 4 levels Chinese administrative division data","archived":false,"fork":false,"pushed_at":"2025-03-09T13:37:42.000Z","size":5226,"stargazers_count":922,"open_issues_count":7,"forks_count":148,"subscribers_count":32,"default_branch":"dev","last_synced_at":"2025-03-21T06:17:34.573Z","etag":null,"topics":["citypicker","javascript","region-selector","vue","vue3"],"latest_commit_sha":null,"homepage":"https://terryz.github.io/docs-vue3/cn/region/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/TerryZ.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG-CN.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2018-05-18T07:49:16.000Z","updated_at":"2025-03-21T03:20:01.000Z","dependencies_parsed_at":"2023-01-15T01:09:38.565Z","dependency_job_id":"675728c1-980d-4ace-8df6-8285d8d7052b","html_url":"https://github.com/TerryZ/v-region","commit_stats":{"total_commits":176,"total_committers":2,"mean_commits":88.0,"dds":0.005681818181818232,"last_synced_commit":"a43e7012373133a1bebbdf2df8081947b1b15f7b"},"previous_names":[],"tags_count":17,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/TerryZ%2Fv-region","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/TerryZ%2Fv-region/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/TerryZ%2Fv-region/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/TerryZ%2Fv-region/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/TerryZ","download_url":"https://codeload.github.com/TerryZ/v-region/tar.gz/refs/heads/dev","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":245308596,"owners_count":20594274,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["citypicker","javascript","region-selector","vue","vue3"],"created_at":"2024-07-31T09:01:07.248Z","updated_at":"2025-03-24T16:31:27.106Z","avatar_url":"https://github.com/TerryZ.png","language":"JavaScript","funding_links":[],"categories":["JavaScript","JavaScript (485)","UI组件","Components \u0026 Libraries","UI Components","UI Components [🔝](#readme)"],"sub_categories":["形成","UI Components","Form"],"readme":"\u003cdiv align=\"center\" style=\"margin-top: 100px;margin-bottom: 100px;\"\u003e\n  \u003cimg src=\"./examples/assets/v-region.png\" width=\"400\" /\u003e\n\u003c/div\u003e\n\n# [v-region](https://terryz.github.io/vue/#/region)\n\n[![CircleCI](https://dl.circleci.com/status-badge/img/gh/TerryZ/v-region/tree/master.svg?style=svg)](https://dl.circleci.com/status-badge/redirect/gh/TerryZ/v-region/tree/master)\n[![code coverage](https://codecov.io/gh/TerryZ/v-region/branch/master/graph/badge.svg?token=FmdV7kVgIp)](https://codecov.io/gh/TerryZ/v-region)\n[![npm version](https://img.shields.io/npm/v/v-region.svg)](https://www.npmjs.com/package/v-region)\n[![JavaScript Style Guide](https://img.shields.io/badge/code_style-standard-brightgreen.svg)](https://standardjs.com)\n[![npm download](https://img.shields.io/npm/dy/v-region.svg)](https://www.npmjs.com/package/v-region)\n\n简洁易用的的中国行政区划选择器，可选择 “省/直辖市”、“市”、“区/县”、“乡/镇/街道” 4 级行政区域\nA simple region cascade selector for vue, provide 4 levels Chinese administrative division data\n\n行政区划数据源更新日期：`2025年02月26日`\n\n如果你的项目正在使用 vue `2.x` 版本，请使用 [v-region 2.x](https://github.com/TerryZ/v-region/tree/dev-vue2) 版本\n\n## 文档与实例（Documentation and Examples）\n\n更多的文档与实例请浏览（Explorer on）\n\n- [github-pages](https://terryz.github.io/docs-vue3/cn/region/)\n\n## 功能特性（Features）\n\n- “省/直辖市”、“市”、“区/县”、“乡/镇/街道” 4 级行政区域选择\n- 丰富的使用形式，提供了\n  - 下拉列表级联模式 `RegionSelects`\n  - 分组模式 `RegionGroup`\n  - 多列竖排模式 `RegionColumns`\n  - 城市选择器模式 `RegionCityPicker`\n  - 纯文本模式 `RegionText`\n- 分组 `Group` 与多列 `Columns` 模式可直接使用核心模块 `RegionGroupCore 与 RegionColumnsCore`，结合其他交互形式可自由组合更多种多样的使用形式，例如结合抽屉 `Drawer`、气泡 `Popover` 或对话框 `Dialog` 使用\n- 部分模式允许使用作用域插槽 `Scoped Slots` 的方式自定义触发对象，让组件更灵活、方便地整合在业务场景中\n- 除省级以外，其它行政区域级别可通过参数进行切换\n- 支持 “直辖市”、“特别行政区” 、“地级市（直筒子市）” 和 “省辖县/省辖县级市” 等特殊行政区域的数据和内容处理\n- 3 级与 4 级行政级别（数据量较大）组件独立拆分使用，按需使用\n\n## 安装插件（Installation）\n\n[![https://nodei.co/npm/v-region.png?downloads=true\u0026downloadRank=true\u0026stars=true](https://nodei.co/npm/v-region.png?downloads=true\u0026downloadRank=true\u0026stars=true)](https://www.npmjs.com/package/v-region)\n\n```sh\n# npm\nnpm i v-region\n# yarn\nyarn add v-region\n# pnpm\npnpm add v-region\n```\n\n在项目里全局安装所有功能模块\n\n```js\nimport { createApp } from 'vue'\nimport App from './app.vue'\nimport Region from 'v-region'\n// 全局安装以下模块\n// RegionGroup\n// RegionSelects\n// RegionColumns\n// RegionCityPicker\n// RegionText\ncreateApp(App).use(Region).mount('#app')\n```\n\n自定义全局安装模块\n\n```js\nimport { RegionSelects } from 'v-region'\n\nconst app = createApp(App)\napp.component('v-region-selects', RegionSelects)\n```\n\n## 在页面中使用（Usage）\n\n```vue\n\u003ctemplate\u003e\n  \u003cRegionSelects\n    v-model=\"region\"\n    @change=\"change\"\n  /\u003e\n\u003c/template\u003e\n\u003cscript setup lang=\"ts\"\u003e\nimport { ref } from 'vue'\nimport { RegionSelects } from 'v-region'\nimport type { RegionValues, RegionModel } from 'v-region'\n\nconst region = ref\u003cRegionValues\u003e({\n  province: '350000',\n  city: '350100',\n  area: '350104',\n  town: '350104008'\n})\nfunction change (data: RegionModel): void {\n  console.log(data)\n}\n\u003c/script\u003e\n```\n\n## 数据源（Data Source）\n\nRegion data come from repo: [mumuy/data_location](https://github.com/mumuy/data_location)\n\n\u003e **原仓库数据说明**\n\u003e 省、市、区数据来自于民政局、国务院公告、国家统计局，确保及时更新和权威；\n\u003e 街道(镇、乡)数据由于数据庞大，各地各级之前公函较多，无法保证及时有效（最新数据2016年7月31日）；\n\u003e 数据是以行政区为单位的行政区划数据。行政管理区与行政区存在重合，不予收录;\n\u003e (行政管理区通常包含:***经济特区/经济开发区/高新区/新区/工业区；亦有部分行政管理区升为行政区，需加以区分)\n\n## Star数趋势（Stargazers over time）\n\n[![Stargazers over time](https://starchart.cc/TerryZ/v-region.svg)](https://starchart.cc/TerryZ/v-region)\n\n# Activity\n\n![Alt](https://repobeats.axiom.co/api/embed/b88b52778a2d98e078e741cc3e5d8ede27f73d3f.svg \"Repobeats analytics image\")\n\n## License\n\n[![FOSSA Status](https://app.fossa.io/api/projects/git%2Bgithub.com%2FTerryZ%2Fv-region.svg?type=large)](https://app.fossa.io/projects/git%2Bgithub.com%2FTerryZ%2Fv-region?ref=badge_large)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FTerryZ%2Fv-region","html_url":"https://awesome.ecosyste.ms/projects/github.com%2FTerryZ%2Fv-region","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FTerryZ%2Fv-region/lists"}