react native draft Objects are not valid as a React child

[renehauck]

Hi, I just tried to integrate "react-native-draftjs-render" into my project and just took your example, but unfortunately I get the error message:

Invariant Violation: Invariant Violation: Objects are not valid as a React child (found: object with keys {key, text, type, depth, inlineStyleRanges, entityRanges, data}). If you meant to render a collection of children, use an array instead.
    in RCTView (at View.js:44)
    in RCTScrollView (at ScrollView.js:977)
    in ScrollView (at DraftViewer.tsx:25)
    in DraftViewer (at ArticleViewDetails.tsx:42)
    in RCTView (at View.js:44)
    in RCTView (at View.js:44)
    in RCTView (at View.js:44)
    in RCTView (at View.js:44)
  ....

My code:

import * as React from 'react';
import getRNDraftJSBlocks from 'react-native-draftjs-render';
import { ScrollView, StyleSheet } from 'react-native';
import contentState from './resourceMock.json';

export interface DraftViewerProps {
    draftJSBlocks: string
}

export interface DraftViewerState {
}

export default class DraftViewer extends React.Component<DraftViewerProps, DraftViewerState> {
    constructor(props: DraftViewerProps) {
        super(props);

        this.state = {
        }
    }

    public render() {
        const blocks = getRNDraftJSBlocks({ contentState });
        return (
              <ScrollView style={{ flex: 1 }}>{blocks}</ScrollView>
        );
    }
}

My versions: react": "16.5.2", "react-native": "0.57.2",

Thank you for your work

[raphaelpor]

Hello @renehauck!

Could you please check if your contentState has an atomic block? If yes, you should define a atomicHandler method to render this block.

Regards,

[renehauck]

sorry, you are right. Thank you. :smiley:

[alihamzabhatti9876]

@raphaelpor , @renehauck sir i have same issue how to make atomichandler.