小编Chr*_*ris的帖子

我正在尝试制作一个带有白色下划线的输入组件。目前，当用户将鼠标悬停在组件上时，下划线颜色变为黑色。我希望这是白色的。我相信这应该可以通过覆盖演示中和下面概述的下划线类来实现。不幸的是，它似乎不起作用，但是如果我在浏览器中手动检查样式并删除下面的行，它会在浏览器中按预期工作。

示例：https : //stackblitz.com/edit/yjpf5s（查看：https : //yjpf5s.stackblitz.io）

在浏览器中手动删除样式以获得所需的功能：

.MuiInput-underline-365:hover:not(.MuiInput-disabled-364):not(.MuiInput-focused-363):not(.MuiInput-error-366):before {
  border-bottom: 2px solid rgba(0, 0, 0, 0.87);

我正在使用的覆盖类样式：

underline: {

        color: palette.common.white,
        borderBottom: palette.common.white,
        '&:after': {
            borderBottom: `2px solid ${palette.common.white}`,          
        },              
        '&:focused::after': {
            borderBottom: `2px solid ${palette.common.white}`,
        },              
        '&:error::after': {
            borderBottom: `2px solid ${palette.common.white}`,
        },                      
        '&:before': {
            borderBottom: `1px solid ${palette.common.white}`,          
        },
        '&:hover:not($disabled):not($focused):not($error):before': {
            borderBottom: `2px solid ${palette.common.white}`,
        },
        '&$disabled:before': {
            borderBottom: `1px dotted ${palette.common.white}`,
        },              
    },

编辑：这是最终工作的解决方案：

'&:hover:not($disabled):not($focused):not($error):before': {
    borderBottom: `2px solid ${palette.common.white} !important`,
},

源代码可以在这里找到:https://github.com/cvanem/ASPNETCoreReact16Redux

编辑:我能够使用以下代码99%使用它.一切都在编译时运行,但是当在父组件中使用时,它会发出一个警告,表明缺少属性计数.实际执行时,一切都按预期工作.此计数属性位于CounterStore中,并在按下按钮时正确递增.一切正常,但我不知道如何摆脱打字稿警告.我在某个地方做错了吗？原始模板将typeof Counter添加到connect语句的末尾,如下所示:

    export default connect(mapStateToProps, mapStateToDispatch )(Counter) as typeof Counter;

当我使用我的代码尝试上述操作时,会出现以下错误:

    ERROR in [at-loader] ./ClientApp/components/Counter.tsx:39:16 
        TS2352: Type 'ComponentClass<Pick<CounterState & ComponentProps & { increment: () => IncrementCountAction; decr...' cannot be converted to type 'typeof Counter'.
    ERROR in [at-loader] ./ClientApp/components/Counter.tsx:39:16 
        TS2352: Type 'ComponentClass<Pick<CounterState & ComponentProps & { increment: () => IncrementCountAction; decr...' cannot be converted to type 'typeof Counter'.
        Type 'Component<Pick<CounterState & ComponentProps & { increment: () => IncrementCountAction; decrement...' is not comparable to type 'Counter'.
Types of …