针对element-ui出现问题的解决办法（2）

一、在输入框中按回车键会刷新页面

当form元素中只有一个input输入框时，在此输入框中按下回车会提交该表单。

如何阻止这一默认行为：可以在<el-form>标签上添加 @submit.native.prevent。

<el-form
    @submit.native.prevent="enterInput"
>
</el-form >

二、el-input的输入框类型type="number"时，去除输入框中聚焦时的上下箭头

<el-input class="clearNumber" type="number"></el-input>
 
<style scoped lang='scss'>
    .clearNumber ::v-deep input[type="number"]::-webkit-outer-spin-button,
    .clearNumber ::v-deep input[type="number"]::-webkit-inner-spin-button {
        -webkit-appearance: none !important;
}
</style>

三、修改el-select下拉框的样式

使用样式穿透::v-deep和/deep/修改下拉框样式无法生效，回来找到原因：是因为el-select下拉框默认挂载在 body 下面。

解决办法：设置:popper-append-to-body="false" ,然后再使用样式穿透即可

  <el-select v-model="value" placeholder="请选择" :popper-append-to-body="false">
    <el-option
      v-for="item in options"
      :key="item.value"
      :label="item.label"
      :value="item.value">
    </el-option>
  </el-select>