2016-07-15 17 views
7

正如標題所說,我一直在試圖找到一種方法來確定文本組件在給定文本後的行數。看看我的例子。React Native:確定文本組件的行數

<Text> 
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi semper ut ipsum in ultrices. Vivamus fringilla lacinia odio in accumsan. Proin sit amet pellentesque tortor. Nam mollis sit amet ligula id convallis. Etiam in semper diam. Cras id elit consectetur, interdum ante id, tincidunt nisi. Integer non elit placerat, dignissim nibh at, faucibus sem. Curabitur nec posuere turpis. Vivamus rhoncus nulla vitae mi imperdiet, elementum eleifend mi laoreet. Vestibulum molestie turpis non nibh elementum, sed ornare magna tristique. Aliquam erat volutpat. Phasellus volutpat mi vel tempor finibus. 
</Text> 

在運行時,如何確定此Text組件已呈現多少行。這個數字取決於設備(例如iPhone 5需要渲染更多的線條,因爲它具有更小的屏幕尺寸)。我檢查了Text組件的源代碼,但似乎沒有任何我想要的東西。

我使用的是React Native 0.24。

任何想法?

乾杯。

+0

想知道這個答案 – digitaldavenyc

回答

5

它看起來像陣營母語0.24實現一個onLayout功能
http://facebook.github.io/react-native/docs/text.html#onlayout

onLayout功能
調用上安裝和佈局的變化與
{nativeEvent:{佈局:{X,Y,寬度,高度}}}

所以它看起來像你可以傳遞一個onLayout回調函數,獲取文本組件的高度,然後做一些計算使用行高達到行數