小编Jou*_*uke的帖子

快速说明：这不是如何更改 Material UI React 输入组件的轮廓颜色的副本？

使用 material-ui (React) 我无法删除悬停或聚焦时的轮廓。我使用这个输入的原因是在出现警告时请求添加一个小的红色边框。我可以更改聚焦和悬停样式。这在下图中进行了测试：

输入焦点时应用此 CSS 的位置：

outlinedInputFocused: {
     borderStyle: 'none',
     borderColor: 'red',
     outlineWidth: 0,
     outline: 'none',
     backgroundColor: 'green'
  },

成分

 <OutlinedInput
            disableUnderline={true}
            notched={true}
            id="adornment-weight"
            classes={{root: classes.outlinedInput, focused: classes.outlinedInputFocused}}
            value={this.state.budgetValue}
            onChange={evt => this.updateBudgetValue(evt)}
            onKeyPress={evt => this.handleKeyPress(evt)}
            endAdornment={<InputAdornment sposition="end">BTC</InputAdornment>}
          />

如您所见，图像的颜色为绿色，但仍有轮廓。即使outlineWidth 为0 并且在CSS 中将outline 设置为none。如何更改/禁用此大纲？

有以小填充正在使用的KeyboardAvoidingView的反应天然。这导致我的键盘在输入字段上移动：

我当前的解决方案
尝试使用keyboardVerticalOffset解决这个问题。
这是来自图像的视图的渲染函数，它使用了 KeyboardAvoidView：

render() {
    return (
      <KeyboardAvoidingView
        behavior="padding"
        key={this.state.keyboardRandomKey}
        keyboardVerticalOffset={50}
      >
        @@ all the other stuff of the design is here @@
      </KeyboardAvoidingView>
    );
  }
}

问题
此图显示了我在实现之前显示的代码后遇到的问题。红色箭头显示了意外行为。
如您所见，正在添加额外的空间，但它是一个灰色区域。这必须是透明的。不知何故，我无法让它发挥作用。我以前在不同的项目中使用过带有负值的 keyboardVerticalOffset 并且效果很好。

任何想法都值得赞赏