• 就个人而言，我不认为果汁是值得挤压这与只是禁用收缩或自动完成登录，但没有人问我的意见，所以... *

据我所知，这比我们希望的更痛苦的原因是因为它最初是作为一种安全功能，以防止通过自动完成密码被盗，但一旦Chrome（等）取消了限制，React的去重复机制就接管了。这里有一些比我将要建议的稍微更像黑客的工作区，但是你可以决定你喜欢哪一个。
要避开这个问题，您可以为每个input的onAnimationStart事件添加一个处理程序，检查animationName是否为"mui-auto-fill"，然后检查input是否有-webkit-autofill pseudo class，以查看浏览器是否自动填充了该字段。您还需要处理"mui-auto-fill-cancel"的情况，在这种情况下，表单是自动填充的，用户清除值（重置shrink）。
举例来说：

const [passwordHasValue, setPasswordHasValue] = React.useState(false);

// For re-usability, I made this a function that accepts a useState set function
// and returns a handler for each input to use, since you have at least two 
// TextFields to deal with.
const makeAnimationStartHandler = (stateSetter) => (e) => {
  const autofilled = !!e.target?.matches("*:-webkit-autofill");
  if (e.animationName === "mui-auto-fill") {
    stateSetter(autofilled);
  }

  if (e.animationName === "mui-auto-fill-cancel") {
    stateSetter(autofilled);
  }
};
...

<TextField
  type="password"
  id="password"
  inputProps={{
    onAnimationStart: makeAnimationStartHandler(setPasswordHasValue)
  }}
  InputLabelProps={{
    shrink: passwordHasValue
  }}
  label="Password"
  value={password}
  onChange={(e) => {
    setPassword(e.target.value);
    ...
  }}
/>

结果on load应显示为：

Updatewith cancel --允许用户在自动填充加载后清除表单字段，并重置标签：

• 仅供参考：我将我的makeAnimationStartHandler作为一个函数，它接受React.useState() setter作为参数，并返回一个实际执行工作的处理程序，因为您的示例有两个字段，我希望1）减少代码，2）如果需要，允许您单独处理每个字段的手动输入用例。
  示例：https://z3vxm7.csb.app/
  工作代码沙箱：https://codesandbox.io/s/autofill-and-mui-label-shrink-z3vxm7?file=/Demo.tsx

谢谢史蒂夫。效果很好。我根据你的回答为我的项目写了一个组件：

import {TextField} from "@mui/material";
import {useCallback, useState} from "react";

const AutoFillAwareTextField = ({onChange, inputProps, InputLabelProps, ...rest}) => {

    const [fieldHasValue, setFieldHasValue] = useState(false)
    const makeAnimationStartHandler = (stateSetter) => (e) => {
        const autofilled = !!e.target?.matches("*:-webkit-autofill");
        if (e.animationName === "mui-auto-fill") {
            stateSetter(autofilled);
        }

        if (e.animationName === "mui-auto-fill-cancel") {
            stateSetter(autofilled);
        }
    }

    const _onChange = useCallback((e) => {
        onChange(e.target.value);
        setFieldHasValue(e.target.value !== "")
    }, [onChange])

    return <TextField
        inputProps={{
            onAnimationStart: makeAnimationStartHandler(setFieldHasValue),
            ...inputProps
        }}
        InputLabelProps={{
            shrink: fieldHasValue,
            ...InputLabelProps
        }}
        onChange={_onChange}
        {...rest}
    />
}
export default AutoFillAwareTextField