vue项目穿透修改element-ui样式

通过穿透解决input输入框数据统计遮挡输入文字问题

一般的input输入框如果配置了show-word-limit数据统计属性，在input框最后的统计文字会将input框内部的文字遮挡住。打开浏览器开发者工具会看到统计文字有element-ui组件自带的DOM节点。

解决方式：

1.首先在vue项目中给input标签设置属性名。

在开发者工具中可以看到其父元素上设置了同样的类名，并且只能在这里设置类名。

2.通过css中的穿透修改element-ui的样式

/deep/.detailAddress .el-input__inner {
  padding-right: 70px;
}

/deep/为穿透修改样式方式。 通过修改input框内的右边距将文字显示出来。修改后的效果如下：