Javascript 使用ReactJS自动建议输入特定字符

所以在使用facebook时，如果你输入@符号，它就会知道你想链接到朋友/页面。我正在组装一个用户界面，允许用户标记古代文档中的文本。我想做的是，如果用户突出显示一个单词或在一个单词前放置一个@#~”符号，它会弹出一个autosuggest或options下拉列表。因此，如果我在键入@name时键入“这是一个与@name相关的文档”，它会提示名称或地点等，事实上，我需要它打开另一个模式，以便您可以输入有关该用户/地点/项目的更多信息

---

我想知道这是否可以通过ReactJS实现，从文档中我似乎找不到这个现成的功能，任何指针都收到了。

当然这是可能的。 我不会使用实际的语法，但我会为您指出正确的方向

假设您拥有搜索/输入组件

它的渲染功能类似于：

render: function(){
    return (<div>
            <input onChange={this.onChange}></input>
            <SuggestionsList data={this.state.value} show={this.state.autoSuggest}></SuggestionsList>
           <div>);
}

您现在需要做的就是创建SuggestionsList组件，该组件将处理获取建议和返回列表的操作

请注意，您不需要使用这种确切的模式，如果您不想显示任何建议，则完全不返回SuggestionList可能更为正确，但这取决于您自己

我建议您遵循facebook的评论教程：

---

他们动态地从服务器获取评论并进行更新。这基本上是相同的模式。

好的，非常感谢您的帮助，我需要集中精力来解决这个问题，然后再玩一玩。Js非常生锈，第一次使用React。这应该很有趣@PaulM查看此开源react autosuggest组件：

onChange: function(val){
    var state = {value: val};
    if(val[0] === '@'){
       state.autoSuggest=true;
    }
    this.setState(state);
}