material-ui TextField 未清除答案

【问题标题】：material-ui TextField not clearingmaterial-ui TextField 未清除
【发布时间】：2020-04-21 15:08:45
【问题描述】：

目前使用这个版本的material-ui：“@material-ui/core”：“^4.2.1”。这是一段代码与网站上提供的示例不一致：

<div>
    <TextField id="outlined-search" label="Search field" type="search" variant="outlined" size="small"/>
</div>

在我的应用程序中，它看起来像这样：no x icon in TextField

在示例代码沙箱中，它看起来像这样：x icon present in TextField

不太清楚问题是什么，因为它看起来很简单。任何帮助将不胜感激。

【问题讨论】：

【解决方案1】：

关于实际的组件 API，它运行良好。

尝试更新您的依赖项，因为 material-ui 的最新版本是 4.8.2。您可以使用npm update 或yarn upgrade 更新它们。

如果这不能解决问题，则似乎某些样式未在您的应用程序中加载，导致清除按钮消失。需要您的代码来进一步诊断。

【讨论】：

import {TextField} from "@material-ui/core"; import React, {Component} from 'react'; class SearchByFilter extends Component { render() { const {handleTagChange} = this.props; return ( <TextField id="search" name="filter_name" label="Filter by Tag" variant="outlined" type="search" onChange={handleTagChange('filter_name')} size={"small"} /> ); } } export default SearchByFilter;
对不起，它的可读性不是很好......我也尝试过更新它，但它似乎没有做任何事情。我认为你是对的，因为这行代码很简单，所以没有加载某些东西，想不出还有什么问题
你在使用 SSR 渲染吗？如果是这样，我可能会遇到很多问题，即在将 SSR 与材质 UI 组件一起使用时无法加载样式。尝试使用 gatsby 插件来加载样式，而不是使用 Material ui 制作样式的代码可能会解决这个问题。