android - JSApplicationIllegalArgumentException 与 React Native Android

Question

最近，我们通过简单的 TextView 将 React Native 集成到我们的应用程序中。我们在所有类型的设备上都会遇到此崩溃。

Fatal Exception: com.facebook.react.bridge.JSApplicationIllegalArgumentException: Error while updating property 'flex' in shadow node of type: RCTView
       at com.facebook.react.uimanager.ViewManagersPropertyCache$PropSetter.updateShadowNodeProp(ViewManagersPropertyCache.java:109)
       at com.facebook.react.uimanager.ViewManagerPropertyUpdater$FallbackShadowNodeSetter.setProperty(ViewManagerPropertyUpdater.java:148)
       at com.facebook.react.uimanager.ViewManagerPropertyUpdater.updateProps(ViewManagerPropertyUpdater.java:52)
       at com.facebook.react.uimanager.ReactShadowNode.updateProperties(ReactShadowNode.java:222)
       at com.facebook.react.uimanager.UIImplementation.createView(UIImplementation.java:177)
       at com.facebook.react.uimanager.UIManagerModule.createView(UIManagerModule.java:222)
       at java.lang.reflect.Method.invoke(Method.java)
       at com.facebook.react.bridge.BaseJavaModule$JavaMethod.invoke(BaseJavaModule.java:318)
       at com.facebook.react.cxxbridge.JavaModuleWrapper.invoke(JavaModuleWrapper.java:158)
       at com.facebook.react.bridge.queue.NativeRunnable.run(NativeRunnable.java)
       at android.os.Handler.handleCallback(Handler.java:739)
       at android.os.Handler.dispatchMessage(Handler.java:95)
       at com.facebook.react.bridge.queue.MessageQueueThreadHandler.dispatchMessage(MessageQueueThreadHandler.java:31)
       at android.os.Looper.loop(Looper.java:234)
       at com.facebook.react.bridge.queue.MessageQueueThreadImpl$3.run(MessageQueueThreadImpl.java:196)
       at java.lang.Thread.run(Thread.java:818)
Caused by java.lang.IllegalArgumentException: method com.facebook.react.uimanager.LayoutShadowNode.setFlex argument 1 has type float, got java.lang.String
       at java.lang.reflect.Method.invoke(Method.java)
       at com.facebook.react.uimanager.ViewManagersPropertyCache$PropSetter.updateShadowNodeProp(ViewManagersPropertyCache.java:99)
       at com.facebook.react.uimanager.ViewManagerPropertyUpdater$FallbackShadowNodeSetter.setProperty(ViewManagerPropertyUpdater.java:148)
       at com.facebook.react.uimanager.ViewManagerPropertyUpdater.updateProps(ViewManagerPropertyUpdater.java:52)
       at com.facebook.react.uimanager.ReactShadowNode.updateProperties(ReactShadowNode.java:222)
       at com.facebook.react.uimanager.UIImplementation.createView(UIImplementation.java:177)
       at com.facebook.react.uimanager.UIManagerModule.createView(UIManagerModule.java:222)
       at java.lang.reflect.Method.invoke(Method.java)
       at com.facebook.react.bridge.BaseJavaModule$JavaMethod.invoke(BaseJavaModule.java:318)
       at com.facebook.react.cxxbridge.JavaModuleWrapper.invoke(JavaModuleWrapper.java:158)
       at com.facebook.react.bridge.queue.NativeRunnable.run(NativeRunnable.java)
       at android.os.Handler.handleCallback(Handler.java:739)
       at android.os.Handler.dispatchMessage(Handler.java:95)
       at com.facebook.react.bridge.queue.MessageQueueThreadHandler.dispatchMessage(MessageQueueThreadHandler.java:31)
       at android.os.Looper.loop(Looper.java:234)
       at com.facebook.react.bridge.queue.MessageQueueThreadImpl$3.run(MessageQueueThreadImpl.java:196)
       at java.lang.Thread.run(Thread.java:818)

我们用 React Native 显示简单的文本

'use strict';

import React from 'react';
import {
  AppRegistry,
  StyleSheet,
  Text,
  View
} from 'react-native';

class HelloWorld extends React.Component {
  render() {
    return (
      <Text style={{color: 'white'}}>React Native is running</Text>
    )
  }
}

AppRegistry.registerComponent('8fit', () => HelloWorld);

我们使用 React Native 0.35.0-rc.0 但我们在稳定版本 0.33.1 中也遇到了同样的崩溃。

您可以在此处找到完整的崩溃报告。 https://gist.github.com/sealskej/1e2398ef1cd9dda2d1b2630348fa612a

非常感谢任何有助于解决问题的帮助!

Answer 1

我不明白为什么这不起作用，但也许解决方案是将它包装在 View 中并在那里设置 flex 的值。例如:

  render() {
    return (
      <View style={{flex: 1}}>
         <Text style={{color: 'white'}}>React Native is running</Text>
      </View>
    )
  }