Expo ReactViro：为reactvision/react-viro组件加position时iOS应用崩溃（EXC_BAD_ACCESS）

作为AR库新手，我尝试开发一个简单的AR应用来显示文字。发现当注释掉<ViroText>的position属性时，应用运行正常；但只要添加position={[0, 2, 0]}，iOS应用就会崩溃。

问题代码 #

<ViroARScene>
  <ViroText
    text={"Hello World"}
    textLineBreakMode="Justify"
    textClipMode="ClipToBounds"
    color="#ff0000"
    width={2}
    height={2}
    position={[0, 2, 0]}
    style={{
      fontFamily: "Arial",
      fontSize: 15,
      // fontWeight: 400,
      fontStyle: "italic",
      color: "#0000FF",
      textAlignVertical:"top"
    }}
  />
 </ViroARScene>

崩溃截图 #

package.json依赖配置 #

{
  "name": "arsocialstories2",
  "main": "expo-router/entry",
  "version": "1.0.0",
  "scripts": {
    "start": "expo start",
    "reset-project": "node ./scripts/reset-project.js",
    "android": "expo run:android",
    "ios": "expo run:ios",
    "web": "expo start --web",
    "test": "jest --watchAll",
    "lint": "expo lint"
  },
  "jest": {
    "preset": "jest-expo"
  },
  "dependencies": {
    "@expo/vector-icons": "^14.0.2",
    "@react-navigation/native": "^6.0.2",
    "@reactvision/react-viro": "^2.41.6",
    "expo": "~51.0.26",
    "expo-camera": "~15.0.14",
    "expo-constants": "~16.0.2",
    "expo-font": "~12.0.9",
    "expo-linking": "~6.3.1",
    "expo-router": "^3.5.21",
    "expo-splash-screen": "~0.27.5",
    "expo-status-bar": "~1.12.1",
    "expo-system-ui": "~3.0.7",
    "expo-web-browser": "^13.0.3",
    "react": "18.2.0",
    "react-dom": "18.2.0",
    "react-native": "0.74.5",
    "react-native-gesture-handler": "~2.16.1",
    "react-native-reanimated": "~3.10.1",
    "react-native-safe-area-context": "4.10.5",
    "react-native-screens": "3.31.1",
    "react-native-web": "~0.19.10"
  },
  "devDependencies": {
    "@babel/core": "^7.20.0",
    "@types/jest": "^29.5.12",
    "@types/react": "~18.2.45",
    "@types/react-test-renderer": "^18.0.7",
    "jest": "^29.2.1",
    "jest-expo": "~51.0.3",
    "react-test-renderer": "18.2.0",
    "typescript": "~5.3.3"
  },
  "private": true
}

我对Swift不熟悉，调试起来非常困难，恳请各位提供帮助！

可能的解决方案 #

• 通过ViroNode包裹设置位置
  React-Viro中部分组件的position属性可能需要通过父容器<ViroNode>来传递，尝试将ViroText嵌套在ViroNode中，给ViroNode设置position：

  <ViroARScene>
    <ViroNode position={[0, 2, 0]}>
      <ViroText
        text={"Hello World"}
        textLineBreakMode="Justify"
        textClipMode="ClipToBounds"
        color="#ff0000"
        width={2}
        height={2}
        style={{
          fontFamily: "Arial",
          fontSize: 15,
          fontStyle: "italic",
          color: "#0000FF",
          textAlignVertical:"top"
        }}
      />
    </ViroNode>
  </ViroARScene>
  

• 验证版本兼容性
  当前使用的@reactvision/react-viro@2.41.6与Expo 51（React Native 0.74.5）可能存在适配问题。建议查看React-Viro官方文档，确认支持的Expo/React Native版本，尝试降级或升级到匹配的版本。

• 清理缓存并重建项目
  执行以下命令清除缓存后重新构建iOS项目：

  expo r -c
  cd ios && pod install && cd ..
  expo run:ios
  

• 检查原生依赖安装
  确认iOS项目的Pod依赖是否正确安装：进入ios目录，执行pod install查看是否有报错，确保react-viro的pod已正确引入并安装。

内容的提问来源于stack exchange，提问作者Vania Oliveira