2

默认情况下，draft.js 将任何带有 2 个空行的原子类型块（1 个在 atimic 之前，1 个在 atimic 之后）。这种行为是由于 draft.js 中缺少原子选择，并在此处进行了描述。我怎样才能摆脱那些线？我在修改器中没有找到任何合适的功能。也许有人有另一种解决方案来解决这个问题，因为现在看起来不太好

更新：我找到适合我的解决方案：

      const { editorState } = this.props;
      const contentState = editorState.getCurrentContent();
      const entityKey = Entity.create('image', 'IMMUTABLE', {src: this.state.url});
      const with_atomic = AtomicBlockUtils.insertAtomicBlock(editorState, entityKey, ' ');
      const new_content_state = with_atomic.getCurrentContent();
      const block_map = new_content_state.getBlockMap();
      const current_atomic_block = block_map.find(block => {
         if (block.getEntityAt(0) === entityKey) {
            return block
         }
      });
      const atomic_block_key = current_atomic_block.getKey();
      const block_before = new_content_state.getBlockBefore(atomic_block_key).getKey();
      const new_block_map = block_map.filter(block => {
         if ((block.getKey() !== block_before) ) {
            return block
         }
      });
      const newContentState = contentState.set('blockMap', new_block_map);
      const newEditorState = EditorState.createWithContent(newContentState);
      this.props.onChange(newEditorState);
4

1 回答 1

3

如果您在插入时需要处理非折叠选择，那不是几行代码。如果您只需要删除原子周围的两行，也许这段代码可以工作：

const newAtomicBlock = contentState.getBlockMap().find(b=>b.getEntityAt(0)===entityKey).getKey();
const newBlockMap = contentState.getBlockMap().delete(contentState.getBlockBefore(newAtomicBlock)).delete(contentState.getBlockAfter(newAtomicBlock));
const newContentState = contentState.set('blockMap', newBlockMap);
const newEditorState = EditorState.push(editorState, newContentState, 'delete-empty-lines');
于 2016-12-13T07:11:14.723 回答