@szmg-fe/community
单纯通过script插入js的方式在小程序下并不适用，而且多端情况下window环境不一定存在，为了解决多端多业务快速接入community_data.js，并快速获得操作社区配置的能力，@szmg-fe/community提供api，能跨端实现社区对象的获取以及提供大量操作社区数据的方法。大部分api内部都有缓存策略，基于此，react应用中甚至可以不使用hook优化。
Usage
@szmg-fe/community诸多api能够work的前提，在于我们的环境中/内部的闭包持有community_data对象，使用api前需要在应用中完成对源数据的引入。
引入community_data
1.web可通过script直接引入，community对象保存在全局的window.allCommunityConfig中
注意，勿改写原始的allCommunityConfig结构，避免未知的错误发生
🙅
<script src="https://shequ.scms.sztv.com.cn/sqt/community_data.js"></script>2.通过npm包方式引入
注意，通过getCommunityDataByJs/getCommunityDataByJsInTaro 都是异步获取的方式，如果需要使用其他的api，需要在then内操作，或者使用await方式
以react应用举例
import getCommunityDataByJs from '@szmg-fe/community/getCommunityDataByJs'
// 在应用入口处调用
function App() {
useEffect(() => {
getCommunityDataByJs().then(res => {
// 这里可以直接拿到res 获取community对象
})
}, [])
}以小程序应用-Taro举例
import getCommunityDataByJsInTaro from '@szmg-fe/community/getCommunityDataByJsInTaro'
class App extends Component {
componentDidMount() {
getCommunityDataByJsInTaro().then(res => {
// 这里可以直接拿到res 获取community对象
});
}
componentDidShow() {
}
...
}Api
getAppCode
根据社区/街道id，获得对应的appCode
import getAppCode from '@szmg-fe/community/getAppCode';
const appCode = getAppCode(16248) === 505; // 福新社区id
const appCode = getAppCode(17050) === 605; // 圆岭街道id
const appCode = getAppCode(17193) === 607; // 前海湾花园idgetAreaData
返回社区内区级数据列表
import getAreaData from '@szmg-fe/community/getAreaData';
const areaData = getAreaData() === [
{ "code": "440303", "name": "罗湖区" },
...
..
.
]; getAreaMap
返回社区内所有区级数据包含的以name&code作为key的散列对象
import getAreaMap from '@szmg-fe/community/getAreaMap';
const areaMap = getAreaMap() === {
'440305': {
name: '南山区',
streetList: [
{
"id": 17314,
"name": "蛇口街道",
...
},
...
]
},
'南山区': {
name: '南山区',
streetList: [
{
"id": 17314,
"name": "蛇口街道",
...
},
...
]
}
...
};getCommunityDataByJs
返回社区数据对象，该方法用在web中
用的是异步获取的方式，推荐使用async/await
import getCommunityDataByJs from '@szmg-fe/community/getCommunityDataByJs';
const communityData = getCommunityDataByJs().then(res) === {
"440303": {
"name": "罗湖区",
"streetlist": {
"qingshuihe": {
"id": 17301,
"name": "清水河街道",
"community": [{
"id": 16457,
"name": "清水河",
...
},
...
]
},
...
}
},
"440304": {
"name": "福田区",
"streetlist": {
"lianhua": {
"name": "莲花街道",
"appcode": 505,
"isTemplate": false,
"community": [{
"id": 16248,
"name": "福新",
...
},
...
]
...
}
},
};
...
};getCommunityDataByJsInTaro
返回社区数据对象，该方法用在Taro小程序中
用的是taro request 异步获取的方式，推荐使用async/await
import getCommunityDataByJsInTaro from '@szmg-fe/community/getCommunityDataByJsInTaro';
const communityData = getCommunityDataByJsInTaro().then(res) === {
"440303": {
"name": "罗湖区",
"streetlist": {
"qingshuihe": {
"id": 17301,
"name": "清水河街道",
"community": [{
"id": 16457,
"name": "清水河",
...
},
...
]
},
...
}
},
"440304": {
"name": "福田区",
"streetlist": {
"lianhua": {
"name": "莲花街道",
"appcode": 505,
"isTemplate": false,
"community": [{
"id": 16248,
"name": "福新",
...
},
...
]
...
}
},
};
...
};getCommunityInfoById
根据街道/社区id 返回街道/社区信息
import getCommunityInfoById from "@szmg-fe/community/getCommunityInfoById";
const communityMap = getCommunityInfoById(16457) === {
"id": 16457,
"name": "清水河",
"ownStreet": {
"appCode": 509,
"area": "罗湖区",
...
"areaInfo": {
"name": "罗湖区",
"streetList": [
{
"appcode": 509,
"community": [
{
"id": 16457,
"name": "清水河",
...
},
...
]
},
]
},
},
...
}; // 清水河街道getCommunityLink
根据街道/社区id 获取对应的地址url
import getCommunityLink from '@szmg-fe/community/getCommunityLink';
const url = getCommunityLink(17193) === 'https://www.sztv.com.cn/h5/yqzs_qianhai/'; // 前海湾街道id
const url = getCommunityLink(16248) === 'https://www.sztv.com.cn/h5/yqzs_index/v1?community=16248'; // 福新社区id
const url = getCommunityLink(17050) === 'https://www.sztv.com.cn/h5/yqzs_index/v4?community=17050'; // 圆岭街道id
const url = getCommunityLink(17551) === 'https://www.sztv.com.cn/h5/yqzs_index/v3?community=17551'; // 南湖街道idgetCommunityMap
返回所有社区的以id/name作为key的map
import getCommunityInMap from "@szmg-fe/community/getCommunityMap";
const communityInMap = getCommunityInMap() === {
"福新": {
....
},
16248: {
"id": 16248,
"name": "福新",
"ownStreet": {
"appCode": 505,
"area": "福田区",
"name": "莲花街道"
"areaInfo": {
"name": "福田区",
"streetList": [
{
"appcode": 505,
"community": [
{
"id": 16254,
"link": "https://www.sztv.com.cn/h5/yqzs/?community=16254",
"name": "福中",
"ownStreet": [
...
]
},
...
]
}
...
]
}
}
}
...
}getCommunityRefineMap
获取社区精细化的map，支持按key/name获取map
import getCommunityRefineMap from "@szmg-fe/community/getCommunityRefineMap";
const map = getCommunityRefineMap('id') === {
16248: {
"id": 16248,
"name": "福新",
"ownStreet": {...}
},
16783: {
...
}
}
const map = getCommunityRefineMap('name') === {
"福新": {
"id": 16248,
"name": "福新",
"ownStreet": {...}
},
"上沙": {
...
}
}getStreetMap
返回社区对象内的街道对象，以id/name/code为key的map'
import getStreetMap from '@szmg-fe/community/getStreetMap'
const streetMapKeyArr = getStreetMap() === {
"海山街道": {
...
},
"haishan": {
...
},
16338: {
"appCode": 506,
"area": "盐田区",
"community": [],
"id": 16338,
"link": "https://www.sztv.com.cn/h5/yqzs_hs_v2",
"name": "海山街道",
"areaInfo": {
"name": "盐田区",
"streetList": [
{
"appcode": 506,
"community": [],
"name": "海山街道",
...
},
]
},
},
...
};getStreetRefineMap
获取街道精细化的map，支持按id/code/name获取map
import getStreetRefineMap from "@szmg-fe/community/getStreetRefineMap";
const map = getStreetRefineMap('id') === {
16338: {
name: '海山街道',
...
},
17653: {
name: '南湖街道',
...
},
};
const map = getStreetRefineMap('name') === {
"海山街道": {
...
},
"南湖街道": {
...
}
}
const map = getStreetRefineMap('code') === {
"haishan": {
...
},
"nanhu": {
...
}
}map2Array
将map 转化为数组
import map2Array from "@szmg-fe/community/map2Array";
import getStreetRefineMap from "@szmg-fe/community/getStreetRefineMap";
const map = getStreetRefineMap('id')
const list = map2Array(map) === [
16338: {
name: '海山街道',
...
},
17653: {
name: '南湖街道',
...
},
]