【vue elementUI】el-select和弹出框el-option样式调整，::v-deep失效

 <el-select
        @change="onFirst"
        class="c-c-select"
        v-model="form.firsetName"
        placeholder="一级分类"
        :popper-append-to-body="false"
      >
        <el-option
          v-for="item in bkData"
          :key="item.id"
          :label="item.name"
          :value="item.id"
        >
        </el-option>
      </el-select>

修改弹出框样式，需要先修改一个属性  :popper-append-to-body="false"

popper-append-to-body

是否将弹出框插入至 body 元素。在弹出框的定位出现问题时，可将该属性设置为 false

boolean

-

true

 修改样式使用::v-deep

 ::v-deep .el-select-dropdown__empty{
    color: white;
  }
  ::v-deep .el-select-dropdown{
    background: #123e81;
  }
  .el-select-dropdown__item.hover,
  :deep .el-select-dropdown__item:hover {
    background-color: #5a6a83;
    color: white;
  }
  .el-select-dropdown__item,
  :deep .el-select-dropdown__item {
    background-color: #123e81;
    color: white;
  }