继续浏览精彩内容
慕课网APP
程序员的梦工厂
打开
继续
感谢您的支持,我会继续努力的
赞赏金额会直接到老师账户
将二维码发送给自己后长按识别
微信支付
支付宝支付

Draft 文档翻译 - API - ContentState

路北
关注TA
已关注
手记 36
粉丝 90
获赞 327
ContentState
============
    ContentState是一个Immutable Record,代表整个 state 包括:
        1. 编辑器的实体内容: 文本,块,内联样式以及实体范围。
        2. 编辑器的两个 selection states, 渲染之前的 selection 和渲染之后的 selection

    ContentState对象最常见的用途是通过 EditorState.getCurrentContent(),
    它提供了当前正在编辑器中呈现的ContentState。

    EditorState对象维护由ContentState对象组成的撤消和重做堆栈。

静态方法
========
    createFromText
    --------------
    | static createFromText(
    |   text: string,
    |   delimiter?: string
    | ): ContentState

    从字符串生成ContentState,并使用分隔符将字符串拆分为 ContentBlock 对象。 
    如果没有提供分隔符,则使用'\ n'。

    createFromBlockArray
    --------------------
    | static createFromBlockArray(
    |   blocks: Array<ContentBlock>,
    |   entityMap: ?OrderedMap
    | ): ContentState

    从ContentBlock对象数组生成ContentState。 
    默认的selectionBefore和selectionAfter状态的光标位于内容开始处。

方法
====
    getEntityMap
    ------------
    | getEntityMap(): EntityMap

    返回包含已创建的所有DraftEntity记录的对象存储。 
    在即将到来的v0.11.0中,返回的地图将是DraftEntity记录的不变的有序地图。

    在大多数情况下,您应该能够使用以下方便的方法来定位特定的DraftEntity记录或获取有关内容状态的信息。

    getBlockMap
    -----------
    | getBlockMap(): BlockMap

    返回表示整个文档状态的ContentBlock对象的完整排序映射。

    在大多数情况下,您应该能够使用以下方便的方法来定位特定的ContentBlock对象或获取有关内容状态的信息。

    getSelectionBefore
    ------------------
    | getSelectionAfter(): SelectionState

    在渲染blockMap之前,返回编辑器中显示的SelectionState。

    在编辑器中执行撤消操作时,当前的选中文字会被放入 selectionBefore 

    getSelectionAfter
    -----------------
    | getSelectionAfter(): SelectionState

    在渲染blockMap之后返回编辑器中显示的SelectionState。

    在编辑器中导致 BlcokMap 重新渲染的所有执行行为,选中的区域将会放置在 selectionAfter 中。

    getBlockForKey
    --------------
    | getBlockForKey(key: string): ContentBlock

    根据key返回 对应的 ContentBlock

    例如

    | var {editorState} = this.state; 
    | // 通过 selectionState 获取 光标所在位置的Block的key
    | var startKey = editorState.getSelection().getStartKey(); 
    | // 然后 通过 contentState 和 block key 获取 这个block
    | var selectedBlockType = editorState
    |   .getCurrentContent()
    |   .getBlockForKey(startKey)
    |   .getType();

    getKeyBefore
    ------------
    | getKeyBefore(key: string): ?string

    返回blockMap中指定键之前的键,如果是第一个键,则返回null。
    ( 查询 blockMap 指定key的前一个key )

    getKeyAfter 
    -----------
    | getBlockAfter(key: string): ?ContentBlock

    ( 查询 blockMap 指定key的后一个key 

    getBlockBefore
    --------------
    | getBlockBefore(key: string): ?ContentBlock

    返回传入Key的前一个Key对应的Block

    getBlockAfter
    -------------
    | getBlockAfter(key: string): ?ContentBlock

    返回传入Key的后一个Key对应的Block

    getBlocksAsArray 
    ----------------
    | getBlocksAsArray(): Array<ContentBlock>

    以数组形式返回blockMap的值。

    您通常不需要使用此方法,因为getBlockMap提供了应用于迭代的OrderedMap。

    getFirstBlock
    -------------
    | getFirstBlock(): ContentBlock

    返回第一个 ContentBlock

    getLastBlock
    ------------
    | getLastBlock(): ContentBlock

    返回最后一个 ContentBlock

    getPlainText
    ------------
    | getPlainText(delimiter?: string): string

    返回内容的完整明文值,并加上分隔符。 如果未指定分隔符,则使用换行字符(\ u000A)。

    getLastCreatedEntityKey
    -----------------------
    | getLastCreatedEntityKey(): string

    返回可用于引用最近创建的DraftEntity记录的字符串键。 
    这是因为实体是通过ContentState中的字符串键引用的。 
    字符串值应在CharacterMetadata对象中使用,以跟踪注释字符的实体。

    hasText
    -------
    | hasText(): boolean

    返回内容是否包含任何文本。

    createEntity
    ------------
    | createEntity(
    |   type: DraftEntityType,
    |   mutability: DraftEntityMutability,
    |   data?: Object
    | ): ContentState

    返回ContentState记录更新,以包括其EntityMap中新创建的DraftEntity记录。 
    调用getLastCreatedEntityKey获取新创建的DraftEntity记录的键。

    getEntity
    -------
    | getEntity(key: string): DraftEntityInstance

    返回指定键的DraftEntityInstance。 如果该密钥没有实例,则抛出。

    mergeEntityData
    ---------------
    | mergeEntityData(
    |   key: string,
    |   toMerge: {[key: string]: any}
    | ): ContentState

    由于DraftEntityInstance对象不可变,因此您无法通过典型的变体方式更新实体的元数据。

    mergeData方法允许您将更新应用于指定的实体。

    replaceEntityData
    -----------------
    | replaceEntityData(
    |   key: string,
    |   newData: {[key: string]: any}
    | ): ContentState

    replaceData方法类似于mergeData方法,除了它将完全丢弃实例的现有数据值,并将其替换为指定的newData。

    addEntity
    ---------
    | addEntity(instance: DraftEntityInstance): ContentState

    在大多数情况下,您将使用contentState.createEntity()。 这是一个方便的方法,您可能不需要经典的Draft中使用。

    添加功能在已经创建实例的情况下很有用,现在需要添加到实体存储。 
    这可能发生在ContentState的一个vanilla JavaScript表示形式正被复原进行编辑的情况下。

属性
====
    使用Immutable Map API设置属性。

    blockMap
    --------
    getBlockMap()

    selectionBefore
    ---------------
    getSelectionBefore()

    selectionAfter
    --------------
    getSelectionAfter()
打开App,阅读手记
0人推荐
发表评论
随时随地看视频慕课网APP