为了账号安全,请及时绑定邮箱和手机立即绑定

Draft 文档翻译 - API - EditorState

标签:
React.JS
EditorState
===========
    EditorState 是 editor 顶级的state对象
    它是一个不可变的记录,代表Draft编辑器的整个状态, 包括:

        1. 当前文本内容状态
        2. 当前选择状态
        3. 内容完整的表示形式
        4. 撤消/重做堆栈
        5. 最新的内容更改类型

    注意:
        你不应该使用 Immutable API去操作 EditorState objects,
        而是使用它自身的 方法

概览
====
    常用的实例方法

    下面的列表包括EditorState对象最常用的实例方法。

常见实例方法
============

    getCurrentContent
    -----------------
    | getCurrentContent(): ContentState

    返回编辑器的当前内容。

    getSelection 
    ------------
    | getSelection(): SelectionState

    返回编辑器的当前光标/选择状态。

    getCurrentInlineStyle
    ---------------------
    | getCurrentInlineStyle(): DraftInlineStyle

    返回一个表示编辑器的“当前”内联样式的OrderedSet <string>。

    如果为当前ContentState和SelectionState插入了一个字符,
    并且考虑了应该应用的任何内联样式覆盖,这将是内联样式值。

    getBlockTree
    ------------
    | getBlockTree(blockKey: string): List;

    返回 Immutable 的 decorated 和styled 范围列表。 
    这用于渲染目的,并基于currentContent和decorator生成。

    在渲染时,该对象用于将内容分解为相应的块,装饰器和样式范围组件。

静态方法
========

    createEmpty
    -----------
    | static createEmpty(decorator?: DraftDecoratorType): EditorState

    返回具有空ContentState和默认配置的新EditorState对象。

    createWithContent
    -----------------
    | static createWithContent(
    |   contentState: ContentState,
    |   decorator?: DraftDecoratorType
    | ): EditorState

    基于提供的ContentState和装饰器返回一个新的EditorState对象。

    create
    ------
    | static create(config: EditorStateCreationConfig): EditorState

    基于配置对象返回一个新的EditorState对象。 
    如果您需要通过上述方法不可用的自定义配置,请使用此选项。

    push
    ----
    | static push(
    |   editorState: EditorState,
    |   contentState: ContentState,
    |   changeType: EditorChangeType
    | ): EditorState

    返回一个新的EditorState对象,并使用指定的ContentState作为新的currentContent。 
    基于changeType,此ContentState可能被视为撤销/重做行为的边界状态。

    必须使用此方法将所有内容更改应用于EditorState。

    要重命名

    undo
    ----
    | static undo(editorState: EditorState): EditorState

    返回一个新的EditorState对象,其中顶部的撤消堆栈应用为新的currentContent。

    现有的currentContent被推到重做堆栈上。

    redo
    ----
    | static redo(editorState: EditorState): EditorState

    返回一个新的EditorState对象,其中重做堆栈的顶部应用为新的currentContent。

    现有的currentContent被推送到撤消堆栈。

    acceptSelection
    ---------------
    | static acceptSelection(
    |   editorState: EditorState,
    |   selectionState: SelectionState
    | ): EditorState

    返回一个新的EditorState对象,并使用指定的SelectionState,但不需要进行选择。

    例如,当DOM选择在我们的控制之外更改时,这是有用的,并且不需要重新渲染。
    (用代码指定选中内容)

    forceSelection 
    --------------
    | static forceSelection(
    |   editorState: EditorState,
    |   selectionState: SelectionState
    | ): EditorState

    返回一个新的具有指定的SelectionState的EditorState对象,强制选择被渲染。

    当选择应在正确的位置手动呈现以维持渲染输出的控制时,这是非常有用的。

    moveSelectionToEnd
    ------------------
    | static moveSelectionToEnd(editorState: EditorState): EditorState

    返回一个新的EditorState对象,其结尾处有选择。

    将选择移动到编辑器的末尾,而不强制对焦。

    moveFocusToEnd 
    --------------
    | static moveFocusToEnd(editorState: EditorState): EditorState

    返回一个新的EditorState对象 选择在最后并且聚焦

    这在我们想以编程方式集中输入的情况下很有用,并且允许用户无缝连续工作是有意义的。

    setInlineStyleOverride
    ----------------------
    | static setInlineStyleOverride(editorState: EditorState, inlineStyleOverride: DraftInlineStyle): EditorState

    返回一个新的EditorState对象,其中指定的DraftInlineStyle应用为要应用于下一个插入字符的内联样式集。

    set
    ---
    | static set(editorState: EditorState, options: EditorStateRecordType): EditorState

    返回一个新的EditorState对象,并传入新的选项。“该方法继承自Immutable record API。

Properties and Getters 
======================
    在大多数情况下,上述的实例和静态方法应足以管理Draft编辑器的状态。

    以下是由EditorState跟踪的属性的完整列表,以及它们相应的getter方法,
    以便更好地提供在该对象中跟踪的状态范围的详细信息。

        注意:
        使用EditorState对象时,不要使用Immutable API。 
        而是使用上面的实例getters和static方法。

    allowUndo
    ---------
    | allowUndo: boolean;
    | getAllowUndo()

    是否允许此编辑器中的撤消/重做行为。 默认值为true。

    由于撤消/重做堆栈是内存保留的主要来源,
    因此如果您具有不需要撤消/重做行为的编辑器UI,则可以考虑将其设置为false。

    currentContent
    --------------
    | currentContent: ContentState;
    | getCurrentContent()

    当前呈现的ContentState。 请参阅getCurrentContent()。

    decorator 
    ---------
    | decorator: ?DraftDecoratorType;
    | getDecorator()

    当前装饰器对象,如果有的话。

    请注意,ContentState与您的装饰器无关。 
    如果提供了装饰器,它将用于装饰文本的范围以进行渲染。

    directionMap
    ------------
    | directionMap: BlockMap;
    | getDirectionMap()

    每个块的映射及其文本方向,由UnicodeBidiService确定。

    您不应该手动管理。

    forceSelection
    --------------
    | forceSelection: boolean;
    | mustForceSelection()

    是否强制显示当前的SelectionState。

    您不应手动设置此属性 - 请参阅forceSelection()。

    inCompositionMode
    -----------------
    | inCompositionMode: boolean;
    | isInCompositionMode()

    用户是否处于IME组合模式。 这对于为IME用户呈现适当的UI是有用的,
    即使没有向编辑器提交任何内容更改。 您不应手动设置此属性。

    inlineStyleOverride 
    -------------------
    | inlineStyleOverride: DraftInlineStyle;
    | getInlineStyleOverride()

    要应用于下一个插入字符的内联样式值。 
    当使用键盘命令或样式按钮来应用折叠选择范围的内联样式时,将使用此选项。

    DraftInlineStyle是不可变的OrderedSet字符串的类型别名,每个字符串对应一个内联样式。

    lastChangeType
    --------------
    | lastChangeType: EditorChangeType;
    | getLastChangeType()

    为了让我们到目前的ContentState,发生了内容变化的类型。 当确定撤销/重做的边界状态时使用。

    nativelyRenderedContent
    -----------------------
    | nativelyRenderedContent: ?ContentState;
    | getNativelyRenderedContent()

    在编辑行为期间,编辑器可能允许某些操作本身呈现。 
    例如,在基于contentEditable的组件中的正常打字行为中,我们通常可以允许键事件在DOM中打印字符。 
    在这样做时,我们可以避免额外的重新呈现并保留拼写检查突出显示。

    当允许本机渲染行为时,使用naturalRenderedContent属性来指示此EditorState不需要重新渲染。

    redoStack
    ---------
    | redoStack: Stack<ContentState>;
    | getRedoStack()

    一个不可变的ContentState对象堆叠,可以重做重做操作。 
    执行撤消操作时,将当前的ContentState推送到redoStack上。

    您不应手动管理此属性。 如果要禁用撤消/重做行为,请使用allowUndo属性。

    See also undoStack.

    selection
    ---------
    | selection: SelectionState;
    | getSelection()

    当前渲染的SelectionState。 请参阅acceptSelection()和forceSelection()。

    您不应手动管理此属性。

    treeMap
    -------
    | treeMap: OrderedMap<string, List>;

    在编辑器组件中渲染的完全装饰和风格的范围树。 
    treeMap对象是基于ContentState和可选装饰器(DraftDecoratorType)生成的。

    在渲染时,组件应该遍历treeMap对象,使用getBlockTree()方法渲染装饰范围和样式范围。

    您不应手动管理此属性。

    undoStack
    ---------
    | undoStack: Stack<ContentState>;
    | getUndoStack()

    一个不可变的ContentState对象堆栈,可以还原以进行撤消操作。
    当执行修改内容的操作时,
    我们确定当前的ContentState是否应被视为用户可以通过执行撤消操作来达到的“边界”状态。 
    如果是这样,则将ContentState推送到undoStack上。 
    如果没有,则丢弃即将发送的ContentState。

    您不应手动管理此属性。 如果要禁用撤消/重做行为,请使用allowUndo属性。
点击查看更多内容
TA 点赞

若觉得本文不错,就分享一下吧!

评论

作者其他优质文章

正在加载中
Web前端工程师
手记
粉丝
90
获赞与收藏
327

关注作者,订阅最新文章

阅读免费教程

  • 推荐
  • 评论
  • 收藏
  • 共同学习,写下你的评论
感谢您的支持,我会继续努力的~
扫码打赏,你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫,即可进行扫码打赏哦
今天注册有机会得

100积分直接送

付费专栏免费学

大额优惠券免费领

立即参与 放弃机会
意见反馈 帮助中心 APP下载
官方微信

举报

0/150
提交
取消