TypeScript prosemirror-view.Decoration类代码示例

OStack程序员社区-中国程序员成长平台 › 门户 › 编程› TypeScript›TypeScript教程

原作者: [db:作者] 来自: [db:来源] 收藏邀请

本文整理汇总了TypeScript中prosemirror-view.Decoration类的典型用法代码示例。如果您正苦于以下问题：TypeScript Decoration类的具体用法？TypeScript Decoration怎么用？TypeScript Decoration使用的例子？那么恭喜您, 这里精选的类代码示例或许可以为您提供帮助。

在下文中一共展示了Decoration类的3个代码示例，这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞，您的评价将有助于我们的系统推荐出更棒的TypeScript代码示例。

示例1:

 const decorations = positions.map(position => {
     const node = document.createElement("span")
     node.appendChild(document.createTextNode(ZWSP))
     return Decoration.widget(position, node, {
         raw: true,
         side: -1,
     } as any)
 })

开发者ID:zodiac-team，项目名称:zodiac-ui，代码行数:8，代码来源:inline-cursor-target.ts

示例2:

const createTextSelection = (from: number, to: number): Decoration =>
    Decoration.inline(from, to, { class: "ProseMirror-fake-text-selection" })

开发者ID:zodiac-team，项目名称:zodiac-ui，代码行数:2，代码来源:fake-cursor-for-toolbar.ts

示例3: Plugin

import { Plugin, EditorState } from "prosemirror-state"
import { DecorationSet, Decoration } from "prosemirror-view"
import { HyperlinkState, InsertStatus, pluginKey } from "./hyperlink"

const createTextCursor = (pos: number): Decoration => {
    const node = document.createElement("div")
    node.className = "ProseMirror-fake-text-cursor"
    return Decoration.widget(pos, node)
}

const createTextSelection = (from: number, to: number): Decoration =>
    Decoration.inline(from, to, { class: "ProseMirror-fake-text-selection" })

const getInsertLinkToolbarState = (editorState: EditorState) => {
    const state = pluginKey.getState(editorState) as HyperlinkState
    if (state && state.activeLinkMark) {
        if (state.activeLinkMark.type === InsertStatus.INSERT_LINK_TOOLBAR) {
            return state.activeLinkMark
        }
    }
    return undefined
}

export const fakeCursorToolbarPlugin: Plugin = new Plugin({
    state: {
        init() {
            return DecorationSet.empty
        },
        apply(tr, pluginState: DecorationSet, oldState, newState) {
            const oldInsertToolbarState = getInsertLinkToolbarState(oldState)
            const insertToolbarState = getInsertLinkToolbarState(newState)

开发者ID:zodiac-team，项目名称:zodiac-ui，代码行数:31，代码来源:fake-cursor-for-toolbar.ts

注：本文中的prosemirror-view.Decoration类示例由纯净天空整理自Github/MSDocs等源码及文档管理平台，相关代码片段筛选自各路编程大神贡献的开源项目，源码版权归原作者所有，传播和使用请参考对应项目的License；未经允许，请勿转载。