Material-ui/ReactJS新手问题。我想在悬停在Material-ui文本字段上时显示指针光标,但是很难做到。它默认使用“cursor:text”。我已成功地更改了悬停时的文本字段背景颜色,但添加“cursor:pointer!important”没有效果。我尝试过使用className、class、style(内联),但我确定我做错了什么。Material-ui有一个演示,说明如何在悬停和聚焦时更改文本字段样式,在[https://codesandbox.io/s/p7uwn?file=/demo.js][1]中我还尝试将光标更改为指针,但仍然没有成功。非常感谢您的任何帮助。
import React from 'react';
import styled from 'styled-components';
import { TextField, NoSsr } from '@material-ui/core';
const StyledTextField = styled(TextField)`
label.Mui-focused {
color: green;
}
.MuiOutlinedInput-root {
fieldset {
border-color: red;
}
&:hover fieldset {
border-color: yellow;
cursor: pointer !important;
}
&.Mui-focused fieldset {
border-color: green;
}
}
`;
export default function GlobalClassName() {
return (
<NoSsr>
<StyledTextField label="Deterministic" variant="outlined" id="deterministic-outlined-input" />
</NoSsr>
);
}
.MuiOutlinedInput-input:hover { cursor: pointer; } .MuiOutlinedInput-input:focus { cursor: auto; }
- Prathmesh Srivastava