{ console.log('h') props.doExpand() }} > {pr" /> { console.log('h') props.doExpand() }} > {pr" /> { console.log('h') props.doExpand() }} > {pr"/>

Using Custom option component in toolbar React Draft Wysiwyg

251 views Asked by At
    const TextAlign = (props) => {
        console.log('PROPS:', props)
        return (
            <button
                type="button"
                onClick={() => {
                    console.log('h')
                    props.doExpand()
                }}
            >
                {props.expaned ? 'Hello' : 'ex'}
            </button>
        )
    }

I'm using it like above and in Editor like below

    <Editor
        ref={editorRef}
        onEditorStateChange={onEditorStateChange}
        onContentStateChange={onContentStateChange}
        editorState={editorState}
        handleKeyCommand={handleKeyCommand}
        toolbar={{
            options: ['history', 'inline', 'textAlign', 'list', 'image'],
            textAlign: {
                component: TextAlign,
            },
        }} 
    />

I'm not sure how to use those props in the component TextAlign? I want to know how to use the props in custom toolbar option component

0

There are 0 answers