ant vue 下拉框样式

Question

有谁知道这个怎么改颜色。

UI：Ant Design vue，select组件。

Answer 1

定制主题、或者css覆盖样式

Answer 2

一个可以直接使用CSS覆盖 .ant-select-dropdown-menu-item 的样式内容。

可能需要配合三箭头 >>> 穿透样式的 scoped

---

另外也可以使用 modifyVars 的方式来进行覆盖默认样式，只是这样修改的话会全局替换默认主题。_{查看官方文档}

例如：

module.exports = {
  css: {
    loaderOptions: {
      less: {
        modifyVars: {
          "layout-footer-background": "#ffffff"
        },
      }
    }
  }
};

只是这样需要找到对应的样式名称。

相对来说第一种方法直接在使用的组件内穿透覆盖直截了当，
但是如果需要全局覆盖的推荐第二种方式。

Answer 3

select 有个选项配置：

getPopupContainer

<a-select :getPopupContainer="(triggerNode) => triggerNode.parentNode" ></a-select>

把它拆入到你的节点下。