使用convertFromHTML时删除空元素（）

我试图在初始化时用一些HTML内容填充Draft.js 0.10.0编辑器。问题是任何没有文本的HTML块元素都不会转换为ContentBlocks。所以从换行符开始的所有额外空格都被删除。使用convertFromHTML时删除空元素（）

我期望下面的代码（或jsfiddle）有一些空的ContentBlocks，但没有。只有包含文本的元素才能获得ContentBlock。它在草案0.9.1中的行为与在this jsfiddle中看到的相同，所以我必须做错某些事情。 HTML可以有所不同，但如果需要操作，我可以访问它。

任何人都知道如何获得空行/内容块与convertFromHTML出现？

const theHTML = 
 
    '<div>first line</div>' + 
 
    '<div></div>' + 
 
    '<p></p>' + 
 
    '<br />' + 
 
    '<div>&nbsp;</div>' + 
 
    '<p>sixth line</p>' + 
 
    '<div>seventh line</div>'; 
 

 
const { 
 
    Editor, 
 
    EditorState, 
 
    ContentState, 
 
    convertFromHTML 
 
} = Draft; 
 

 
class Container extends React.Component { 
 
    constructor(props) { 
 
    super(props); 
 
    const blocksFromHTML = convertFromHTML(theHTML); 
 
    const contentState = ContentState.createFromBlockArray(
 
     blocksFromHTML.contentBlocks, 
 
     blocksFromHTML.entityMap 
 
    ); 
 
    this.state = { 
 
     editorState: EditorState.createWithContent(contentState) 
 
    }; 
 
    } 
 
    render() { 
 
    return (
 
     <div className = "container-root" > 
 
     <Editor 
 
     editorState = { this.state.editorState } 
 
     onChange = { this._handleChange } /> 
 
     </div> 
 
    ); 
 
    } 
 
    _handleChange = (editorState) => { 
 
    this.setState({ 
 
     editorState 
 
    }); 
 
    } 
 
} 
 

 
ReactDOM.render(<Container /> , document.getElementById('react-root'))

body { 
 
    font-family: Helvetica, sans-serif; 
 
} 
 

 
.container-root { 
 
    border: 1px solid black; 
 
    padding: 5px; 
 
    margin: 5px; 
 
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/immutable/3.8.1/immutable.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/draft-js/0.10.0/Draft.js"></script> 
 

 
<div id="react-root"></div>

来源

2017-03-15 Paul

没办法。

convertFromHTMLToContentBlocks.js：

// Kill whitespace after blocks 
    if (
    lastInA === '\r' 
) { 
    if (B.text === SPACE || B.text === '\n') { 
     return A; 
    }

为了让您将需要使用自己实现convertFromHTML()或叉草案-js和修改该文件空块。

来源

2017-03-18 19:10:31

这只是杀WS中的文本，但是为什么'

'不会产生空块 –

'产生一个空的块，然后它就会被删除。 –

感谢提示@Mikhail。我一直在尝试修改你链接到的'joinChunks（）'方法。我可以评论它的一部分，但是然后我最终得到一堆不在HTML中的额外块。如果您对如何修改该文件有任何指导，我们都会很感激。 – Paul

使用convertFromHTML时删除空元素（）

回答

相关问题