Question

给出一些文字，例如：

这是一些文字

我想对这段文本中可以重叠的部分进行分类。使用Draft.js可以很容易地指定，因为我可以在实体范围对象中指定两个对象，如下所示：

...
entityRanges: [{
    offset: 5,
    length: 7,
    key: 0
}, {
    offset: 0,
    length: 7,
    key: 1
}]
...

Draft.js允许在渲染时重叠实体而不使用装饰器（至少据我所知，实体以合理的方式运行）。但是，在使用装饰器将渲染逻辑应用于实体时：

const decorator = new CompositeDecorator([
  {
    strategy: (contentBlock, callback, contentState) => ... callback(x,y),
    component: SomeFuncComponent
  }
])

实体不能重叠，并且entityRanges中的对象被调整为没有重叠（即，在这种情况下，第二个实体的长度更改为5）

我想做的是使用一个装饰器，该装饰器允许我将整个块的文本作为单个组件返回。然后，我自己处理实体。在这种情况下，我返回的组件将类似于以下内容：

// This function is referenced via CompositeDecorator objects' 'component' key
const SomeFuncComponent = (props) => <...>...</...>

调用SomeFuncComponent的结果将是这样的JSX：

<React.Fragment>
  <span data-entity-start="1"/>This <span data-entity-start="0"/>is<span data-entity-end="1"/> some<span data-entity-end="0"/> text
</React.Fragment>

这是我可以通过Draft.js中的装饰器实现的东西吗？

是否可以在Draft.js中编写自定义装饰器，以允许一次处理整个块而不是单个实体？

0 个答案: