在my页面里点击自定义主题 模拟器立即卡死 什么也点不了 但是我的里的列表可以滚动 不知道为什么 刚开始的时候modal还能出来，突然就不行了
必须重新加载代码才能点，但是一点自定义又卡死 也没开debug啥的 
不知道是不是数据请求造成的
自定义主题页
import React from 'react';
import { View, Text, Image, ScrollView, TouchableHighlight, Modal, StyleSheet, Platform } from 'react-native';
import globalStyle from '../../assets/styles/globalStyle';
import { ThemeFlags } from '../../assets/styles/themeFactory';

export default class CustomTheme extends React.Component {
  constructor(props) {
    super(props);
  }
  getThemeItemView(key) {
    return <TouchableHighlight
             style={{flex: 1}}
             underlayColor={'#ffffff'}
             onPress={() => this.onSelectTheme(key)}
           >
              <View style={[{backgroundColor: ThemeFlags[key]},styles.themeItem]}>
                <Text style={styles.themeText}>{key}</Text>
              </View>
           </TouchableHighlight>
  }
  onSelectTheme(key) {
    this.props.onClose()
  }
  renderThemView() {
    let views = [];
    let keys =  Object.keys(ThemeFlags);
    for (var i = 0; i < keys.length; i+=3) {
      views.push(
        <View key={i} style={{flexDirection: 'row'}}>
          {this.getThemeItemView(keys[i])}
          {this.getThemeItemView(keys[i+1])}
          {this.getThemeItemView(keys[i+2])}
        </View>
      )
    }
    console.log(views)
    return views
  }
  renderThemeContent() {
    return <Modal
              animationType={"slide"}
              transparent={true}
              visible={this.props.visible}
              onRequestClose={() => this.props.onClose()}
           >
              <View style={styles.modalContainer}>
                <ScrollView>
                  {this.renderThemView()}
                </ScrollView>
              </View>
           </Modal>
  }
  render() {
    let view = this.props.visible ? <View style={globalStyle.root_container}>
      {this.renderThemeContent()}
    </View>:null
    return view
  }
}

const styles = StyleSheet.create({
  modalContainer: {
    flex: 1,
    margin:10,
    marginTop:Platform.OS==='ios'?20:10,
    backgroundColor:'white',
    borderRadius:3,
    shadowColor:'gray',
    shadowOffset:{width:2,height:2},
    shadowOpacity:0.5,
    shadowRadius:2,
    padding:3
  },
  themeItem: {
    flex: 1,
    height: 120,
    margin:3,
    padding:3,
    borderRadius:2,
    alignItems: 'center',
    justifyContent: 'center',
  },
  themeText:{
      color:'#ffffff',
      fontWeight:'500',
      fontSize:16
  }
})

我的页面

import React from 'react';

import { View, Text, Image, ScrollView, TouchableHighlight, StyleSheet } from 'react-native';

import NavigationBar from '../commons/navigationBar';

import { FLAG_LANGUAGE } from '../commons/LanguageDao';

import { MORE_MENU } from '../commons/MoreMenu';

import globalStyle from '../../assets/styles/globalStyle';

import viewUtils from '../../tools/viewUtils';

import CustomTheme from './CustomTheme';

export default class My extends React.Component {

  constructor(props) {

    super(props);

    this.state = {

      isShowCustomeTheme: false

    }

  }

  onclick(tag) {

    let targetRouteName, params = {};

    switch (tag) {

      case MORE_MENU.Custom_Language:

        targetRouteName = 'CustomKeyPage';

        params.flag = FLAG_LANGUAGE.flag_language;

        break;

      case MORE_MENU.Sort_Language:

        targetRouteName = 'SortKeyPage';

        params.flag = FLAG_LANGUAGE.flag_language;

        break;

      case MORE_MENU.Custom_Key:

        targetRouteName = 'CustomKeyPage';

        params.flag = FLAG_LANGUAGE.flag_key;

        break;

      case MORE_MENU.Sort_Key:

        targetRouteName = 'SortKeyPage';

        params.flag = FLAG_LANGUAGE.flag_key;

        break;

      case MORE_MENU.Remove_Key:

        targetRouteName = 'CustomKeyPage';

        params.flag = FLAG_LANGUAGE.flag_key;

        params.isRemove = true;

        break;

      case MORE_MENU.Custom_Theme:

        this.setState({isShowCustomeTheme: true})

        break;

      case MORE_MENU.About_Author:

        targetRouteName = 'AboutMe'

        break;

      case MORE_MENU.About:

        targetRouteName = 'About';

        break;

    }

    if (targetRouteName) {

      this.props.navigation.navigate(targetRouteName, params)

    }

  }

  getItem(tag, icon, text) {

    return viewUtils.getSettingItem(() => this.onclick(tag), icon, text, {tintColor: '#2196f3'}, null)

  }

  renderCustomTheme() {

    return (

      <CustomTheme

        {...this.props}

        visible={this.state.isShowCustomeTheme}

        onSelectTheme={(themeKey) => this.onSelectTheme(themeKey)}

        onClose={() => this.setState({isShowCustomeTheme: false})}

      />

    )

  }

  render() {

    return (

      <View style={globalStyle.root_container}>

        <NavigationBar title="我的" />

        <ScrollView>

          <TouchableHighlight

            onPress={() => this.onclick(MORE_MENU.About)}

          >

            <View style={[styles.item, {height: 90}]}>

              <View style={styles.itemLeft}>

                <Image

                  source={require('../../assets/images/ic_trending.png')}

                  style={[{width: 40,height: 40,marginRight: 10}, {tintColor: '#2196f3'}]}

                />

                <Text>GitHub Popular</Text>

              </View>

              <Image

                source={require('../../assets/images/ic_tiaozhuan.png')}

                style={[{width: 22,height: 22,marginRight: 10}, {tintColor: '#2196f3'}]}

              />

            </View>

          </TouchableHighlight>

          <View style={globalStyle.line} />

          {/*语言管理*/}

          <Text style={styles.groupTitle}>语言管理</Text>

          <View style={globalStyle.line} />

          {this.getItem(MORE_MENU.Custom_Language, require('../../assets/images/ic_custom_language.png'), '自定义语言')}

          <View style={globalStyle.line} />

          {/*语言排序*/}

          {this.getItem(MORE_MENU.Sort_Language, require('../../assets/images/ic_swap_vert.png'), '语言排序')}

          {/*标签管理*/}

          <Text style={styles.groupTitle}>标签管理</Text>

          <View style={globalStyle.line} />

          {this.getItem(MORE_MENU.Custom_Key, require('../../assets/images/ic_custom_language.png'), '自定义标签')}

          <View style={globalStyle.line} />

          {/*标签排序*/}

          {this.getItem(MORE_MENU.Sort_Key, require('../../assets/images/ic_swap_vert.png'), '标签排序')}

          {/*标签移除*/}

          <View style={globalStyle.line} />

          {this.getItem(MORE_MENU.Remove_Key, require('../../assets/images/ic_remove.png'), '标签移除')}

          {/*设置*/}

          <Text style={styles.groupTitle}>设置</Text>

          <View style={globalStyle.line} />

          {/*自定义主题*/}

          {this.getItem(MORE_MENU.Custom_Theme, require('../../assets/images/ic_view_quilt.png'), '自定义主题')}

          <View style={globalStyle.line} />

          <View style={globalStyle.line} />

          {/*关于作者*/}

          {this.getItem(MORE_MENU.About_Author, require('../../assets/images/ic_insert_emoticon.png'), '关于作者')}

          <View style={globalStyle.line} />

        </ScrollView>

        {this.renderCustomTheme()}

      </View>

    )

  }

}

const styles = StyleSheet.create({

  container: {

    flex: 1,

  },

  item: {

    flexDirection: 'row',

    alignItems: 'center',

    justifyContent: 'space-between',

    padding: 10,

    height: 60,

    backgroundColor: '#fff'

  },

  itemLeft: {

    flexDirection: 'row',

    alignItems: 'center'

  },

  groupTitle: {

    marginLeft: 10,

    marginTop: 10,

    marginBottom: 5,

    fontSize: 12,

    color: 'gray'

  }

})

好像是有时候卡死有时候只是有点卡，弹框能出来 如果我把debug打开 反而不卡了 真是神奇。。。。。还老报这种警告