Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Address options for antd cascader
import provinces from 'china-division/dist/provinces.json';
import cities from 'china-division/dist/cities.json';
import areas from 'china-division/dist/areas.json';
areas.forEach((area) => {
const matchCity = cities.filter(city => city.code === area.cityCode)[0];
if (matchCity) {
matchCity.children = matchCity.children || [];
matchCity.children.push({
label: area.name,
value: area.code,
});
}
});
cities.forEach((city) => {
const matchProvince = provinces.filter(province => province.code === city.provinceCode)[0];
if (matchProvince) {
matchProvince.children = matchProvince.children || [];
matchProvince.children.push({
label: city.name,
value: city.code,
children: city.children,
});
}
});
const options = provinces.map(province => ({
label: province.name,
value: province.code,
children: province.children,
}));
export default options;
@afc163

This comment has been minimized.

Copy link
Owner Author

commented Feb 15, 2017

Live Demo: https://codesandbox.io/s/m4ljw91j0j

Based on china-division.

import { Cascader } from 'antd';
import options from './cascader-address-options';

ReactDOM.render(<Cascader options={options} />, mountNode);
@chenxia123

This comment has been minimized.

Copy link

commented Jul 3, 2017

为什么我npm install 了china-division, 但是import provinces from 'china-division/dist/provinces.json';的时候,并没有把数据引用过来,返回值是一个{}??

@jasper-pan

This comment has been minimized.

Copy link

commented Sep 4, 2017

我也遇到你的问题,因为没有json-loader,webpack打包不识别json文件,npm install json-loader后再webpack里配置下就ok了

@MHwishes

This comment has been minimized.

Copy link

commented Sep 19, 2017

thank you,很有用

@Ccheng2729111

This comment has been minimized.

Copy link

commented Sep 22, 2017

用到了,谢谢。

@ZhengYingqian

This comment has been minimized.

Copy link

commented Dec 28, 2017

这个貌似是React的调用方式,请问在Angular里面怎么调用这个包?

@catnipan

This comment has been minimized.

Copy link

commented Mar 19, 2018

最新的 china-division (2.0.0) 数据字段有变化,上面行6的 parent_code 应为 cityCode,行17的 parent_code 应为 provinceCode

@afc163

This comment has been minimized.

Copy link
Owner Author

commented Mar 25, 2018

@catnipan Thx, fixed

@fubobing126

This comment has been minimized.

Copy link

commented Mar 28, 2018

thank you

@qiuliang1

This comment has been minimized.

Copy link

commented Apr 18, 2018

请问这个只能用npm install china-division下载引入吗

@lazyTai

This comment has been minimized.

Copy link

commented Nov 27, 2018

@afc163 大兄弟,没有香港台湾!!!

@lazyTai

This comment has been minimized.

Copy link

commented Nov 27, 2018

@yuyichen

This comment has been minimized.

Copy link

commented Feb 13, 2019

自己用高德api封装了一个组件,写完才看到antd Cascader文档最下面的一行小字

@sojitao

This comment has been minimized.

Copy link

commented Apr 22, 2019

如果要做国际化,怎么办

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.