26
4
My options structure is like below
我的期权结构如下
个人中心
文章发布
退出const options = 'option1', 'option2'];
I want to render option with icon like this:
我想使用如下图标来渲染选项：
My current code for renderOption is :
我当前的renderOption代码是：
renderOption = (options => {
return (
<Fragment>
<SearchIcon>
<img src = {searchIcon.svg}/>
</SearchIcon>
{options}
</Fragment>
)
})
But I got error:
但我弄错了：
Can anyone help me render options that don't have labels with icon?
有没有人可以帮我渲染没有图标标签的选项？
Thank you!
谢谢!
Normally that icon indicates, where the user would have to click to start the search. Why do you want to use that icon for every option?
通常，该图标指示用户必须单击才能开始搜索的位置。为什么每个选项都要使用该图标？
I cannot see your code in order to help you fix your issue according to your need, but you are close to where you needed to be, which is to utilize the renderOption props for <Autocomplete> component.
我看不到您的代码是为了帮助您根据需要修复问题，但您已经接近了所需的位置，即使用
In this case, what you want to do is actually this
在这种情况下，您要做的实际上是
<Autocomplete
renderOption={(props, option) => (
<li {...props}>
<SearchIcon />
{option.label}
</li>
)}
// ... and rest of the props
/>
See doc for renderOption API for Autocomplete here https://mui.com/material-ui/api/autocomplete/#Autocomplete-prop-renderOption
有关自动完成的renderOption API，请参阅此处https://mui.com/material-ui/api/autocomplete/#Autocomplete-prop-renderOption的文档
CodeSandbox demo: https://codesandbox.io/s/clever-goldberg-kqq5pq?file=/Demo.tsx
代码沙盒演示：https://codesandbox.io/s/clever-goldberg-kqq5pq?file=/Demo.tsx
Thanks for your help! But my options structure is [option1, option2], it doesn't have a label. Then what should I put in "{option.label}" ?
谢谢你的帮忙!但我的期权结构是[option1，option2]，它没有标签。那我应该在“{option.bel}”里填什么呢？
In that case, just option will suffice, because MUI automatically knows what is passed in for the autocomplete. I have updated the CodeSandbox demo that matches more to your scenario so you can refer to :)
在这种情况下，只要选项就足够了，因为MUI自动知道为自动完成传入了什么。我已经更新了与您的场景更匹配的CodeSandbox演示，因此您可以参考：)
26
4
0
运行 PostgreSQL(7.4 和 8.x)，我认为这是可行的，但现在我遇到了错误。 我可以单独运行查询，它工作得很好，但如果我使用 UNION 或 UNION ALL，它会抛出错误。 这个错误:
我试图为我的应用程序创建一个导航，使用抽屉导航我的 fragment 之一(HomeFragment)有一个 ViewPager，可容纳 3 个 fragment (Bundy Clock、Annou
以我目前正在开发的应用为例: - 它有一个包含多个项目的抽屉导航；现在有两个项目让我感兴趣，我将它们称为 X 和 Y。 X 和 Y 都在单击时显示包含 x 元素或 y 元素列表的 fragment 选
我有一个形状为 (370,275,210) 的 NumPy 数组，我想将其重新整形为 (275,210,370)。我将如何在 Python 中实现这一点？ 370是波段数，275是行数，210是图像包
我们如何与被子 UIViewController 阻止的父 UIViewController(具有按钮)交互。显然，触摸事件不会通过子 Nib 。 (启用用户交互) 注意:我正在加载默认和自定义 NI
我是 Jpa 新手，我想执行过程 我的代码如下 private static final String PERSISTENCE_UNIT_NAME = "todos"; private static
与安装了 LAMP 的 GCE 相比，选择与 Google Cloud SQL 链接的 GCE 实例有哪些优势？ 我确定 GCE 是可扩展的，但是安装在其上的 mysql 数据库的可扩展性如何？ 使用
这个问题在这里已经有了答案: Value receiver vs. pointer receiver (3 个答案) 关闭 3 年前。 我刚接触 golang。只是想了解为 Calc 类型声明的两种
我不小心按了一个快捷键，一个非常漂亮的断线出现在日期上。 有点像 # 23 Jun 2010 -------------------- 有人知道有问题的快捷方式吗？？ (我在 mac 上工作!) 在
我正在Scala中编写正则表达式 val regex = "^foo.*$".r 这很好，但是如果我想做 var x = "foo" val regex = s"""^$x.*$""".r 现在我们有
以下 XML 文档在技术上是否相同？ James Dean 19 和: James Dean 19 最佳答案 这两个文档在语义上是相同的。在 X
我在对数据帧列表运行稳健的线性回归模型(使用 MASS 库中的 rlm)时遇到问题。 可重现的示例: var1 <- c(1:100) var2 <- var1*var1 df1 <- data.f
好的，我有一个自定义数字键盘，可以在标签(numberField)中将数字显示为 0.00，现在我需要它显示 $0.00。 NSString *digit = sender.currentTitle;
在基于文档的应用程序中，使用 XIB 文件，创建新窗口时其行为是: 根据最后一个事件的位置进行定位和调整大小 window 。 如果最后一个事件窗口仍然可见，则新窗口 窗口应该是级联的，这样它就不会直
我想使用参数进行查询，如下所示: SELECT * FROM MATABLE WHERE MT_ID IN (368134, 181956) 所以我考虑一下 SELECT * FROM MATABLE
我遇到一些性能问题。 我有一个大约有 200 万行的表。 CREATE TABLE [dbo].[M8]( [M8_ID] [int] IDENTITY(1,1) NOT NULL,
我在 jquery 中的按键功能遇到问题。我不知道为什么按键功能不起作用。我已经使用了正确的 key 代码。在我的函数中有 2 个代码，其中包含 2 个事件键，按一个键表示 (+) 代码 107 和(
我想显示音频波形，我得到了此代码，它需要.raw音频输入并显示音频波形，但是当我放入.3gp，.mp3音频时，我得到白噪声，有人可以帮助我如何使其按需与.3gp一起使用使用.3gp音频运行它。 Inp
我无法让 stristr 函数返回真值，我相信这是因为我的搜索中有一个 $ 字符。 当我这样做时: var_dump($nopricecart); 完整的 $nopricecart 值是 $0 ，我得
如果我有这样的循环: for(int i=0;i O(n) 次。所以do some执行了O(n)次。如果做某事是线性时间，那么代码片段的复杂度是O(n^2)。 关于algorithm - 带 If 语
我是一名优秀的程序员,十分优秀！