Material UI InputLabel - 当输入为空时禁用动画

Question

当我的输入字段为空且未聚焦时，Material UI 会将标签放置在输入字段内作为占位符。

我想要的是，始终在输入字段上方放置标签，类似于选择输入字段时的样子。

我怎样才能做到这一点？

示例代码：

     <FormControl>
        <InputLabel htmlFor="name">Name</InputLabel>
        <Input name="name"
               value={name}/>
      </FormControl>

Answer 1

对于那些正在寻找如何使用TextField组件实现这一点的人，这里：

<TextField
  variant="outlined"
  InputLabelProps={{
    shrink: true,
  }}
/>

Answer 2

经过30分钟的拉扯我的头发......我终于明白了。您正在寻找的房产并不disableAnimation像人们想象的那样被称为房产，而是房产shrink。API 文档 - https://material-ui.com/api/input-label/

  <FormControl>
    <InputLabel htmlFor="name" shrink='true'>Name</InputLabel>
    <Input name="name"
           value={name}/>
  </FormControl>