Benjamin-Dobell / react-native-markdown-view

MarkdownView for React Native
MIT License
190 stars 77 forks source link

Android: Cannot add a child that doesn't have a YogaNode to a parent without a measure function! #45

Open fujianjin6471 opened 4 years ago

fujianjin6471 commented 4 years ago

Code below:

<MarkdownView>
    {' - a\n- b'}
</MarkdownView>

If I remove the space at the very beginning, it will be ok

fujianjin6471 commented 4 years ago

On iOS, it works well

antonisierakowski commented 4 years ago

Can confirm, getting the same error message on Android (iOS works fine) when I try to nest a list inside a quote like this: > * this crashes android.

isonlaxman commented 4 years ago

Same issue with me, Android. I'm only using bold and italics as well

MiloszFilimowski commented 4 years ago

It's caused by View being passed to Text. I created a workaround (filtering out components that are not text) for now because I'm not sure what's the actual root cause.

            <MarkdownView
                rules={{
                    list: {
                        render: (node, output, state, styles) => (
                            <View key={state.key} style={styles.list}>
                                {node.items.map((item, i) => (
                                    <View key={i} style={styles.listItem}>
                                        {node.ordered ? (
                                            <Text style={styles.listItemNumber}>{`${i + 1}.`}</Text>
                                        ) : (
                                            <Text style={styles.listItemBullet}>
                                                {styles.listItemBullet &&
                                                styles.listItemBullet.content
                                                    ? styles.listItemBullet.content
                                                    : '\u2022'}
                                            </Text>
                                        )}
                                        <Text
                                            style={
                                                node.ordered
                                                    ? styles.listItemOrderedContent
                                                    : styles.listItemUnorderedContent
                                            }
                                        >
                                            {output(item, state).map((item) => {
                                                if (item.type?.displayName == 'Text') {
                                                    return item
                                                } else {
                                                    return null
                                                }
                                            })}
                                        </Text>
                                    </View>
                                ))}
                            </View>
                        ),
                    },
                }}
            >
                {'Text'}
            </MarkdownView>

Hope it helps :)