React Native Switch on Android 报错

Question

我在 RN 0.21.0 中使用 Android 上的 Switch：

 <Switch
          onValueChange={(value) => this.setState({trueSwitchIsOn: value})}           
          value={this.state.trueSwitchIsOn} />

显示错误：

(standard input):43372:03-03 09:32:02.096 E/unknown:React(11609): Exception in native call from JS
(standard input):43373:03-03 09:32:02.096 E/unknown:React(11609): java.lang.NullPointerException
(standard input):43374:03-03 09:32:02.096 E/unknown:React(11609):   at android.text.StaticLayout.<init>(StaticLayout.java:58)
(standard input):43375:03-03 09:32:02.096 E/unknown:React(11609):   at android.support.v7.widget.SwitchCompat.makeLayout(SwitchCompat.java:606)
(standard input):43376:03-03 09:32:02.096 E/unknown:React(11609):   at android.support.v7.widget.SwitchCompat.onMeasure(SwitchCompat.java:526)
(standard input):43377:03-03 09:32:02.096 E/unknown:React(11609):   at android.view.View.measure(View.java:16529)
(standard input):43378:03-03 09:32:02.096 E/unknown:React(11609):   at com.facebook.react.views.switchview.ReactSwitchManager$ReactSwitchShadowNode.measure(ReactSwitchManager.java:56)
(standard input):43379:03-03 09:32:02.096 E/unknown:React(11609):   at com.facebook.csslayout.CSSNode.measure(CSSNode.java:137)
(standard input):43380:03-03 09:32:02.096 E/unknown:React(11609):   at com.facebook.csslayout.LayoutEngine.layoutNodeImpl(LayoutEngine.java:294)
(standard input):43381:03-03 09:32:02.096 E/unknown:React(11609):   at com.facebook.csslayout.LayoutEngine.layoutNode(LayoutEngine.java:210)
(standard input):43382:03-03 09:32:02.096 E/unknown:React(11609):   at com.facebook.csslayout.LayoutEngine.layoutNodeImpl(LayoutEngine.java:492)
(standard input):43383:03-03 09:32:02.096 E/unknown:React(11609):   at com.facebook.csslayout.LayoutEngine.layoutNode(LayoutEngine.java:210)
(standard input):43384:03-03 09:32:02.096 E/unknown:React(11609):   at com.facebook.csslayout.LayoutEngine.layoutNodeImpl(LayoutEngine.java:492)

所以我猜是测量错误并设置了尺寸：

  <Switch
              onValueChange={(value) => this.setState({trueSwitchIsOn: value})}
              style={{width:100, height:40, backgroundColor:'#a03'}}
              value={this.state.trueSwitchIsOn} />

然后错误消失并显示没有 **Switch ** 视图的空白区域。

Answer 1

我也遇到过你这样的问题，不知道怎么解决，我用 npm install react-native-material-switch 替换了官方的开关。