2017-03-09 2 views
5

초안을 처음 사용하며 편집기에 내 맞춤 구성 요소를 인라인으로 렌더링하는 방법이 있는지 궁금합니다.소품이 포함 된 초안 구성 요소

트위터 핸들이있는 문자열이 있습니다. 나는 장식자를 사용하여 핸들을 대체하고 구성 요소를 인라인으로 렌더링하는 regex @ [{handle}]을 탐지합니다. 그러나 내 핸들 구성 요소에는 콜백 함수 및 URL과 같은 속성이 필요합니다.

필자는 내 구성 요소에 내 ContentEditable 구성 요소에 전달하는 URL 및 콜백 함수를 전달하는 방법을 잘 모르겠습니다.

나는 뭔가를 놓친 것 같습니다. 나는 contentState.getEntity(entityKey).getType()을 확인했으나, 복합 장식 자로 전달한 내용은 렌더링되지 않은 부분과 별도의 블록으로 장식 된 부분으로 만 볼 수 있습니다. 나는 이것이 올바른 접근 방법이나

사람이 내가 놓친 거지 알고 있나요 엔티티지도에서 내 자신의 실체를 정의하는 경우는 엔티티지도를 수정할 수 있지만 잘 모르겠어요 것을 본 적이

구성 요소에 속성을 제공 하시겠습니까?

const decorator = new CompositeDecorator([ 
    { 
    strategy: handleStrategy, 
    component: Handle, 
    }, 
]); 


export default class ContentEditable extends component { 
    const content = 'some messages and my handle @[handle]'; 
    if (this.props.content.trim() !== '') { 
     const processedHTML = DraftPasteProcessor.processHTML(content); 
     const entityMap = processedHTML.entityMap; 
     const contentState = ContentState.createFromBlockArray(processedHTML.contentBlocks, entityMap); 
     // Create with content with decorator 
     editorState = EditorState.createWithContent(contentState, decorator); 
    } else { 
     // Create empty content with decorator 
     editorState = EditorState.createEmpty(decorator); 
    } 
    this.state = { 
     editorState, 
    } 
} 

render() { 
    return (
     <Editor 
      editorState={this.state.editorState} 
      onChange={this.onChange} 
      ref="editor" 
     /> 
    ); 
    } 

답변

1

죄송합니다. 문서가 누락되었습니다. 에 props을 입력 할 수 있습니다. CompositeDecorator({strategy:xxx,component:xxx,props:{...}}) 확인 source

관련 문제