材质 UI 文本字段无法更改多行的字体大小

Question

我正在尝试更改 Material UI 多行 TextField 的字体大小。为此，我设置style InputProp如下：

inputProps={{style: {fontSize: "14px"}}}

问题是默认的输入道具样式会被覆盖，从而防止文本字段的高度动态更改以容纳多行。

如何正确更改多行 Material UI 文本字段的字体大小？

注意：我使用的是内联样式，而不是类名。

Answer 1

您只需要使用InputProps（大写“I”）而不是inputProps. 小写字母inputProps被传递到最后一个textarea元素，但为了使样式正常工作，InputBase包装textarea在 a 中的组件div需要具有正确的字体大小。

这是一个工作示例：

import React from "react";
import ReactDOM from "react-dom";
import TextField from "@material-ui/core/TextField";

function App() {
  return (
    <div className="App">
      <TextField multiline InputProps={{ style: { fontSize: 40 } }} />
    </div>
  );
}

const rootElement = document.getElementById("root");
ReactDOM.render(<App />, rootElement);