ReactJS - 使包含标签和自由文本的文本输入成为模板。

问题描述 投票:0回答:1

我正在研究一个简单的方法,让一个自由的文本输入,也可以包含多个可替换的标签来创建模板。如这张图 例子

在那张图片中,巫师球员(标签)的信息将被存储.后来,我将重复使用该模板,并取代一个值的标签.像。伊涅斯塔的进球,里瓦尔多的进球,... ...

我找不到一个可以完成这项工作的lib。我所做的一些尝试都是为了解决这个问题,导致了极其复杂的输入与重新定义选择(onClick,onKeydown,onSelect,维持当前选择),因为用户不能用手来编辑标签(他们是通过点击按钮触发的)。

是否有人已经处理过这种输入?


编辑:由于我的问题似乎不清楚,我将添加一些细节。事实上,输入应该工作,因为它是一个自由的文本输入,但也应该允许添加标签芯片,由外部触发器提供(onClick按钮)。

例子:我将在[日]做[活动]。我将在[日]进行[活动]。

首先,我 键入 "我将使" 然后我点击 按钮 "活动" 这将增加一个 "活动 "标签芯片 到输入。我继续 打 "上" 最后点击 按钮 "日" 添加 标签 "日".

然后我会把这个作为模板存储起来,通过更换标签,在多个场景下重复使用。比如

  • 我会在周一做三明治

  • 我星期五会做运动

reactjs variables input text tags
1个回答
0
投票

如果有人有同样的问题。我终于找到了合适的lib 标签化. 它有一个混合模式(文本+标签)。

© www.soinside.com 2019 - 2024. All rights reserved.