TypeScript EditorState.set方法代码示例

export function removeHighlight(editorState, styleName) {
    const highlightsState = getHighlightsState(editorState);

    if (highlightsState.highlightsData[styleName] === undefined) {
        return editorState;
    }

    const nextHighlightsStyleMap = {...highlightsState.highlightsStyleMap};

    delete nextHighlightsStyleMap[styleName];

    const nextHighlightsData = {...highlightsState.highlightsData};

    delete nextHighlightsData[styleName];

    const newHighlightsState = {
        lastHighlightIds: highlightsState.lastHighlightIds,
        highlightsStyleMap: nextHighlightsStyleMap,
        highlightsData: nextHighlightsData,
    };

    let newEditorState = clearInlineStyles(
        editorState,
        getDraftSelectionForEntireContent(editorState),
        [styleName],
    );

    // prevent recording the changes to undo stack so user doesn't have to undo twice
    // for the highlight deletion to be completelly(both inline styles and related data) undone
    newEditorState = EditorState.set(newEditorState, {allowUndo: false});
    newEditorState = setHighlightsState(newEditorState, newHighlightsState);
    newEditorState = EditorState.set(newEditorState, {allowUndo: true});

    return newEditorState;
}

export function addHighlight(editorState, type, data, single = false) {
    let nextEditorState = editorState;

    const initialSelection = nextEditorState.getSelection().merge({
        hasFocus: true,
    });

    const highlightsState = getHighlightsState(nextEditorState);

    if (highlightTypeValid(type) !== true) {
        throw new Error('Highlight type invalid');
    }

    if (single && selectionHasType(editorState, type)) {
        return editorState;
    }

    let newIndex = 0;

    if (highlightsState.lastHighlightIds && has(highlightsState.lastHighlightIds, type)) {
        newIndex = highlightsState.lastHighlightIds[type] + 1;
    }
    const styleName = type + '-' + newIndex;

    const newHighlightsState = {
        lastHighlightIds: {
            ...highlightsState.lastHighlightIds,
            [type]: newIndex,
        },
        highlightsStyleMap: {
            ...highlightsState.highlightsStyleMap,
            [styleName]: availableHighlights[type],
        },
        highlightsData: {
            ...highlightsState.highlightsData,
            [styleName]: {
                ...data,
                type,
            },
        },
    };

    nextEditorState = RichUtils.toggleInlineStyle(nextEditorState, styleName);

    // prevent recording the changes to undo stack so user doesn't have to undo twice
    // for the highlight to be completelly(both inline styles and related data) undone
    nextEditorState = EditorState.set(nextEditorState, {allowUndo: false});

    nextEditorState = setHighlightsState(nextEditorState, newHighlightsState);

    // make sure the cursor is at the right position after undo
    // it used to always end up at the position 0 of the first block
    // when undoing after changing block data with `allowUndo` set to false
    nextEditorState = EditorState.push(
        nextEditorState,
        nextEditorState.getCurrentContent().set('selectionBefore', initialSelection),
        'change-block-data',
    );

    // restore focus lost after clicking a toolbar action or entering highlight data OR pushing editorState
    // so the selection is visible after undo
    nextEditorState = EditorState.acceptSelection(
        nextEditorState,
        initialSelection,
    );

    nextEditorState = EditorState.set(nextEditorState, {allowUndo: true});

    return nextEditorState;
}