2016-12-06 73 views
12

在陣營原生0.39渲染,陣營本地視圖與明確設置寬度/高度,但以0 flexBasis

我經常會收到這樣的錯誤,但我真的不明白爲什麼(APPART,我沒這個事實沒有設置flexGrow ...)。

下面是從控制檯錯誤

View was rendered with explicitly set width/height but with a 0 flexBasis. (This might be fixed by changing flex: to flexGrow:) View: <RCTShadowView: 0x6080005a02a0; viewName: RCTView; reactTag: 2608; frame: {{0, 0}, {nan, nan}}> 

可以給我這樣的人解釋爲什麼會觸發這個錯誤?

編輯:這個錯誤來自該位的樣板代碼我加在主視圖:

flex: 1, 
// remove width and height to override fixed static size 
width: null, 
height: null, 

但如果有人能闡明反應,原生樣式光或使我很好的資源,我會感激:)

+2

骯髒的方式:替換柔性:與flexGrow:如果你有寬度和高度 –

+0

這就是錯誤說...但爲什麼? –

+0

我遇到了同樣的問題= = – subei

回答

3

參考react-native/React/Views/RCTShadowView.m,必須有評論

This works around a breaking change in css-layout where setting flexBasis needs to 
be set explicitly, instead of relying on flex to propagate. 

    We check for it by seeing if a width/height is provided along with a flexBasis 
of 0 and the width/height is laid out as 0. 

的錯誤是觸發當flex未定義flexBasis並且寬度和高度都爲零

參考react-native/Libraries/StyleSheet/LayoutPropTypes.js,我們知道flexGrow,flexShrink和flexBasis接收值的數量。

對於視覺指導,您可能會參考這個網頁,A Visual Guide to CSS3 Flexbox Properties

+0

感謝您的詳細解釋:) –

+3

升級後我也得到了這個,但是很難確定發生了什麼: 'ExceptionsManager.js:71 View顯式設置了寬度/高度,但有一個0 flexBasis。(這可能通過更改flex來解決:flexGrow :)查看:' – Marc

+0

您是否設置了樣式上的任何彈性,寬度和高度都會觸發該錯誤? –

1

指定flexDirection: 'row'解決問題¯\_(ツ)_/¯

1

由於錯誤狀態 - 改變「柔性」到「flexGrow」和問題就解決了。

關於這個的難點在於如何找到'flex'需要從整個項目中改變。我所做的是(使用Atom編輯器,所以'在項目中查找'...)使用'flexGrow:'更改每個'flex:'(最後使用':'確保您更改樣式),然後只需在整個項目中重新搜索'flexGrow',然後使用'flex'從每個文件更改每個'flexGrow',直到找到損壞的'flex'。

我更喜歡使用flex而不是flexGrow,這就是爲什麼我恢復爲flex。這就是爲什麼:Layout Props

希望這可以解決問題。

0

在node_modules/react-native/React/Views/RCTShadowView.m在第170行添加「//」,如下所示:「// RCTAssert(!YGNodeIsDirty(node),@」嘗試從髒瑜伽節點。 「);」