Draft 文件翻譯 - API - ContentState

nt1979發表於2021-09-09
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,
    |   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

    以陣列形式返回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()

來自 “ ITPUB部落格 ” ,連結:http://blog.itpub.net/4822/viewspace-2799247/,如需轉載,請註明出處,否則將追究法律責任。

相關文章