Vue修改element-ui库的输入框样式--样式穿透

方法：样式穿透

1、自定义一个自己的类样式.input_border，内容是调整输入框的弧度border-radius: 30px。
2、.el-input__inner是element-ui样式原本的类样式，通过样式穿透（>>>）更改其中的部分内容
3、如何确定原本的类样式呢？通过浏览器的右键检查（或F12），右侧的调试框

4、如何修改的完整步骤

<el-input v-model="input" :class="input_border" placeholder="请输入内容" clearable prefix-icon="el-icon-search" size="mini" />
<script>
export default {
  name: "HomeHeader",
  data() {
    return {
      input_border:'input_border'
    }
  }
}
</script>
<style lang="stylus" rel="stylesheet/stylus" scoped>
.input_border >>> .el-input__inner
  border-radius: 30px
</style>