gpt4 book ai didi

javascript - React,在下拉菜单中使用表情符号

转载 作者:行者123 更新时间:2023-11-29 17:38:29 30 4
gpt4 key购买 nike

我一直在用 React 开发一个小游戏,游戏的一部分允许玩家在开始之前设置一些设置。这是一款回合制标签游戏,四名玩家在 map 上追逐不同的标记,同时避开标记为“it”的玩家。

我有以下用于选择选项的渲染方法:

render() {
return (
<div>
<form onSubmit={this.createPlayers} ref="form">
<label htmlFor="goodies">Choose a Goody!</label>
<select name="goodies" id="goodies">
<option value="donut">🍩</option>
<option value="cookie">🍪</option>
<option value="hotdog">🌭</option>
<option value="bacon">🥓</option>
<option value="hamburger">🍔</option>
<option value="brocolli">🥦</option>
</select>
<button type="submit">Play!</button>
</form>
</div>
);
}

我收到一个很大的警告,说我需要将它们包装在 span 元素中,添加一些 aria 标签并给它们一个错误的 Angular 色。

Line 18: Emojis should be wrapped in <span>, have role="img", and have an accessible description with aria-label or aria-labelledby jsx-a11y/accessible-emoji

我这样做了,然后 JSX 拒绝编译,因为它期望每个选项都有一个字符串。它不会让我在选项标签之间放置一个跨度。

我真的很想让这个警告消失,但是当我尝试执行它要求的操作时,JSX 无法编译。我必须做些什么才能在没有警告的情况下完成这项工作吗?

问题是,我在别处使用了表情符号,但没有收到任何警告或任何问题。

最佳答案

加入选择<span role="img" aria-label="xxxxx">像这样

 <select name="goodies" id="goodies">
<option value="donut">
<span role="img" aria-label="donut">🍩</span>
</option>
....
</select>

关于javascript - React,在下拉菜单中使用表情符号,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54565516/

30 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com