React Native 省市区地址选择器（仿京东）

产品经理：“你明白吧，这里向右划可以出菜单，然后需要一个闪烁的动画，还有，我想这个tab可以拉下来，你懂吧？ 设计师：“别废话，把你要抄的产品给我看下。”
…
接下来，我们仿一下别人家的地址挑选器
省市区数据格式的json文件

项目基于react-native-scrollable-tab-view 组件编写，https://github.com/skv-headless/react-native-scrollable-tab-view

import React, { Component, PropTypes } from 'react';
import {
    ViewPropTypes,
    StyleSheet,
    View,
    TouchableOpacity,
    TouchableNativeFeedback,
    Platform,
    Animated,
    Text
} from 'react-native';

export default class SelectCityTabBar extends Component {
   
    //属性声名
    static propTypes = {
        goToPage: PropTypes.func,
        activeTab: PropTypes.number,
        tabs: PropTypes.array,
        backgroundColor: PropTypes.string,
        activeTextColor: PropTypes.string,
        inactiveTextColor: PropTypes.string,
        textStyle: Text.propTypes.style,
        tabStyle: ViewPropTypes.style,
        renderTab: PropTypes.func,
        underlineStyle: ViewPropTypes.style,
    };
    //默认属性
    static defaultProps = {
        activeTextColor: '#FA3D4F',
        inactiveTextColor: 'black',
        backgroundColor: null,
    }

    renderTab(name, page, isTabActive, onPressHandler) {
        const { activeTextColor, inactiveTextColor, textStyle, } = this.props;
        const textColor = isTabActive ? activeTextColor : inactiveTextColor;
        const fontWeight = isTabActive ? 'bold' : 'normal';
        const viewStyle = isTabActive ? [styles.tab, { borderBottomWidth: Constant.sizeDividerLarge, borderColor: Constant.colorPrimary }] : styles.tab;

        if (Platform.OS !== 'ios') {
            return <TouchableNativeFeedback
                delayPressIn={
  0}
                background={TouchableNativeFeedback.SelectableBackground()}
                key={name + page}
                accessible={
  true}
                accessibilityLabel={name}
                accessibilityTraits='button'
                onPress={
  () => onPressHandler(page)}
            >
                <View style={viewStyle}>
                    <Text style={[{ color: textColor, fontWeight, }, textStyle,]}>
                        {name}
                    </Text>
                </View>
            </TouchableNativeFeedback>
        }

        return <TouchableOpacity
            key={name + page}
            accessible={
  true}
            accessibilityLabel={name}
            accessibilityTraits='button'
            onPress={
  () => onPressHandler(page)}
        >
            <View style={viewStyle}>
                <Text style={[{ color: textColor, fontWeight, }, textStyle,]}>
                    {name}
                </Text>
            </View>
        </TouchableOpacity>;
    }

    render() {
        return (
            <View style={
  { flexDirection: 'row', borderBottomWidth: Constant.sizeDividerNormal, borderColor: Constant.colorDivider }}>
                {
  this.props.tabs.map((name, page) => {
                    const isTabActive = this.props.activeTab === page;
                    const renderTab = this.props.renderTab || this.renderTab;
                    return this.renderTab(name, page, isTabActive, this.pro