React Native 城市选择(四)获取城市名称
城市选择使用Ant Design Mobile RN中的城市选择功能(https://rn.mobile.ant.design/components/picker-cn/)
但是这个库最后返回的value(城市编码),并没有返回label(城市名称)
官方文档暴露的所有接口
当我们需要使用城市名称的时候那么我们如何获取呢?
历经种种尝试,最终找到了format,可以在这个函数中做截取到城市名称
具体操作如下:
1、声明全局变量
var lables: string[]
2、format中添加操作
format: ((labels: string[]) => string) | undefined; this.format = (labels: string[]) => { let kk = labels.join(' ') // 这里不能在state中存储,否则会报错,所以使用全局变量存储 lables = labels this.listData(); if (kk && kk.length) { return kk } else { return '工作地' } };
3、组件中赋值
<Picker data={datacity} cols={2} format={this.format} value={this.state.value} onOk={this.onOk} title={<Text style={style.topView_title}>选择工作地</Text>} okText={<Text style={style.topView_buttonText}>确定</Text>} dismissText={<Text style={style.topView_buttonText}>取消</Text>} > <CustomChildren></CustomChildren> </Picker>
经过上述操作,我们就可以拿到城市名称了