小编Sun*_*bar的帖子

我在我的项目中使用 React Material UI Select 组件。我已经成功获得了大部分所需的自定义样式，但是当下拉纸张可见时，或者选择一个选项并将鼠标移离该框时，选择框周围仍然有一个蓝色轮廓（但它是仍然是焦点）。我需要定位哪个元素才能从选择框中删除蓝色轮廓？我尝试过针对不同的部分并使用，outline: none但我似乎找不到解决方案。我还阅读了 React Material 文档并搜索了 Stackoverflow，但找不到答案。任何帮助将非常感激。这是选择框的演示：

https://codesandbox.io/s/select-dropdown-hr7yx-hr7yx?file=/src/App.js

import { makeStyles } from "@material-ui/core/styles";
import React from "react";
import "./styles.css";
import FormControl from "@material-ui/core/FormControl";
import Select from "@material-ui/core/Select";
import MenuItem from "@material-ui/core/MenuItem";

const useStyles = makeStyles(theme => ({
  quantityRoot: {
    color: "#FFFFFF",
    backgroundColor: "#303039",
    opacity: 0.6,
    borderRadius: "5px",
    "&:hover": {
      backgroundColor: "#1E1E24",
      borderRadius: "5px",
      opacity: 1
    },
    "&:focus-within": {
      backgroundColor: "#1E1E24",
      borderRadius: "5px",
      opacity: 1
    },
    "& .MuiOutlinedInput-notchedOutline": {
      border: "1px solid #484850"
    }, …