React Material UI TextField 悬停鼠标图标

Question

当 TextField 具有 variant="outlined" 时，我想更改 Material UI 组件的 TextField 的默认鼠标光标行为。在这种情况下，光标是文本，我想把它作为一个指针。我试图如下覆盖它，但它没有用。我也将 MuiInputBase 更改为 TextField，但仍然没有用

  const myTheme = createTheme({
    overrides: {
        MuiInputBase: {
        root: {
          '&:hover:': {
            cursor: "pointer"
          },
        }
      }
    }
  });

然后在我的提供商中：

<ThemeProvider theme={myTheme}>
   <TextField variant="outlined"/>
</ThemeProvider>

Answer 1

只需将root更改为input

MuiInputBase: {
  input: {
    "&:hover": {
      cursor: "pointer",
    },
  },
},

React Material UI TextField 悬停鼠标图标

React Material UI TextField hover mouse icon

reactjs

material-ui

textfield

mousehover

mouse-cursor