长期待在这一段时间并且无法弄明白。
我有两个组件,由父组件控制。有一个名为“选定”的属性。因此,当用户单击列表时,它将更新父组件的selected
属性,该属性将传递给TagInput
,该属性使用draft-js中的MentionPlugin
。
为了解决这个问题,我实现了一个componentWillReceiveProps
,如下所示。
componentWillReceiveProps(nextProps) {
const { initialTags: newTags } = nextProps;
const previousTags = this.getTags(this.state.editorState);
if (previousTags.length !== newTags.length) {
const added = newTags.filter(tag => !previousTags.includes(tag));
const removed = previousTags.filter(tag => !newTags.includes(tag));
this.addMentions(added);
this.removeMentions(removed);
}
}
虽然通过创建新实体并插入实体很容易在addMentions
中添加实体,但在我的生命中,我无法弄清楚如何通过文本获取Mention
然后将其从编辑。
removeMentions(tags) {
const { editorState } = this.state;
for (const tag of tags) {
// find tag in editor
// select it and remove it
}
}
如何做到这一点?