Vue 使用el-upload样式问题

使用ul-upload,我想知道为什么会出现如下图的虚线边框:

img

代码:

    <!--头像和用户名-->
    <div class="user-header">
      <div class="user-pic">
        <img :src="userForm.headPic" />
      </div>
      <span class="user-name">{{ userForm.name }}</span>
      <el-upload
        :action="this.objData.host"
        :show-file-list="false"
        :before-upload="housePolicy"
        :data="objData"
        :on-success="savePics"
      >
        <el-button size="small">更换头像</el-button>
      </el-upload>
    </div>


样式:

.user-header {
  height: 150px;
  text-align: center;
}
.user-pic img {
  margin: auto;
  width: 100px;
  height: 100px;
  border-radius: 50%;
  object-position: center;
  background-color: azure;
}
.user-name {
  display: block;
  margin-top: 10px;
  font-size: 25px;
}

默认就有

img

.demo-block .avatar-uploader .el-upload{border:none}