Question

我升级了使用CRNA创建的react native项目。升级之前，项目在iOS上运行正常，但是在将其加载到android设备/模拟器上时遇到了一些问题，我希望升级能够解决这些问题。我将博览会从版本27.0.1升级到31.0.4，我通读了全文： https://docs.expo.io/versions/latest/workflow/upgrading-expo-sdk-walkthrough 检查是否有重大更改。

我逐步完成了升级博览会： https://docs.expo.io/versions/v31.0.0/workflow/upgrading-expo

旧package.json：

{
  "name": "FamScore3",
  "version": "0.1.0",
  "private": true,
  "devDependencies": {
    "react-native-scripts": "1.14.0",
    "jest-expo": "~27.0.0",
    "react-test-renderer": "16.3.1"
  },
  "main": "./node_modules/react-native-scripts/build/bin/crna-entry.js",
  "scripts": {
    "start": "react-native-scripts start",
    "eject": "react-native-scripts eject",
    "android": "react-native-scripts android",
    "ios": "react-native-scripts ios",
    "test": "jest"
  },
  "jest": {
    "preset": "jest-expo"
  },
  "dependencies": {
    "@firebase/auth": "^0.7.6",
    "@firebase/database": "^0.3.6",
    "axios": "^0.18.0",
    "expo": "^27.0.1",
    "firebase": "^5.5.1",
    "react": "16.3.1",
    "react-native": "~0.55.2",
    "react-native-elements": "^0.19.1",
    "react-native-material-dropdown": "^0.11.1",
    "react-native-router-flux": "^4.0.1",
    "react-redux": "^5.0.7",
    "redux": "^4.0.0",
    "redux-thunk": "^2.3.0"
  }
}

旧的app.json：

{
  "expo": {
    "sdkVersion": "27.0.0"
  }
}

升级后的package.json：

{
  "name": "FamScore3",
  "version": "0.1.0",
  "private": true,
  "devDependencies": {
    "react-native-scripts": "1.14.0",
    "jest-expo": "^31.0.0",
    "react-test-renderer": "16.3.1"
  },
  "main": "./node_modules/react-native-scripts/build/bin/crna-entry.js",
  "scripts": {
    "start": "react-native-scripts start",
    "eject": "react-native-scripts eject",
    "android": "react-native-scripts android",
    "ios": "react-native-scripts ios",
    "test": "jest"
  },
  "jest": {
    "preset": "jest-expo"
  },
  "dependencies": {
    "@firebase/auth": "^0.7.6",
    "@firebase/database": "^0.3.6",
    "axios": "^0.18.0",
    "metro-react-native-babel-preset": "^0.45.0",
    "expo": "^31.0.4",
    "firebase": "^5.5.1",
    "react": "16.5.0",
    "react-native": "https://github.com/expo/react-native/archive/sdk-31.0.1.tar.gz",
    "react-native-elements": "^0.19.1",
    "react-native-material-dropdown": "^0.11.1",
    "react-native-router-flux": "^4.0.1",
    "react-redux": "^5.0.7",
    "redux": "^4.0.0",
    "redux-thunk": "^2.3.0"
  }
}

升级的app.json：

{
  "expo": {
    "sdkVersion": "31.0.0"
  }
}

升级完成后，我在iPhone 6s上重新安装了expo应用程序。我清除了expo中的缓存。关闭expo打包程序和终端，然后重新启动计算机。

现在，该应用在iOS和Android上均引发错误。在iOS上，我收到错误消息：

Error received on physical device

第一个错误所在的位置（与图标相关）：

<Button style={styles.buttonStyle} textStyle={{ flex: 1 }} onPress={() => this.authUser()}>
            <Icon
              iconStyle={styles.iconStyle}
              size={iconSize}
              color={'#ea8a8a'}
              type='simple-line-icon'
              name={'heart'}
            />
            Login
          </Button>

这里使用的按钮实际上不是从react-native导入的，而是我用相同名称制作的一个自定义按钮（可能是个坏主意，但是嘿）：

class Button extends Component {

  render() {
    return (
      <TouchableOpacity onPress={this.props.onPress} style={[styles.buttonStyle, this.props.style]}>
        <Text style={[styles.textStyle, this.props.textStyle]}>{this.props.children}</Text>
      </TouchableOpacity>
    )
  }
}

export { Button }

在更新之前这从来都不是问题，我似乎真的找不到导致此代码中断的原因。任何帮助将不胜感激，因为我发现自己在这里盘旋。如果您希望我为您提供任何其他代码，我们将很乐意为您提供。预先感谢一堆。

Answer 1

按钮不接受此语法。如果您的按钮中需要图标，请尝试使用TouchableHighlight或类似的方法：

<TouchableHighlight onPress={()=>{}}>
     <View>
         <Icon
              iconStyle={styles.iconStyle}
              size={iconSize}
              color={'#ea8a8a'}
              type='simple-line-icon'
              name={'heart'}
            />
        <Text> Login </Text>
     </View>
 </TouchableHighlight>

React Native-Expo：不变违反：<view>在<text>内的嵌套目前不受支持

1 个答案: