我在我的redux商店中有这些数据,我想在反应组件中渲染 .
{
"entityMap":{
"0":{
"type":"LINK",
"mutability":"MUTABLE",
"data":{"url":"www.google.co.in"}
}
},
"blocks":[
{
"key":"9k5h7",
"text":"this is the link",
"type":"unstyled",
"depth":0,
"inlineStyleRanges":[],
"entityRanges":[
{
"offset":12,
"length":4,
"key":0
}
],
"data":{}
}
]
}
我成功地设法创建了一个带草稿编辑器的链接类型,并且能够将其存储在数据库中,并且在呈现它时,除了链接之外我得到了整个文本 . 我在我的redux中有这个链接信息,即“实体图”以及“块”内的“entityRanges”,它告诉链接开始的偏移量和长度是多少 . 例如,在我的情况下,它是“这是链接”中的“链接” .
这是我用来从我的redux渲染上面的json的代码:
render(){
return(
<div>
{
var nn = abovejsonfromreduxstore;
var editorState = EditorState.createWithContent(convertFromRaw(JSON.parse(nn)));
return (
<div>
<pre>
<Editor
editorState={editorState}
readOnly
/>
</pre>
</div>
</div>
}
</div>
);
}
如何修改此渲染方法以便它也呈现链接实体?
1 回答
你应该这样指定draft.js decorator:
将
findLinkEntities
函数传递给strategy
属性,将Link
反应组件传递给component
属性:之后,将这个装饰器传递给
createWithContent
方法:查看下面隐藏代码段中的工作示例: