请描述在 Vue 项目中覆盖 Element UI 组件默认样式的几种常见方法，并说明各自的适用场景与潜在问题。

回答思路

1. 【回答框架 1】Element UI 组件默认样式通过编译后的 CSS 类名输出，修改方式分为全局覆盖与局部覆盖。全局覆盖可以新建一个样式文件，并在入口文件引入，利用同权重 CSS 后加载覆盖默认样式；或者使用 SCSS 变量修改主题。
2. 【回答框架 2】局部覆盖通常使用 scoped 样式，但需要借助深度选择器穿透子组件作用域，如 /deep/、::v-deep 或 >>>。在 Vue 2 中使用 ::v-deep，在 Vue 3 中建议使用 :deep()，这能避免 scoped 属性导致的样式不生效。
3. 【回答框架 3】另一种方式是自定义主题，通过修改 Element UI 的 SCSS 变量并重新编译，适用于大面积修改颜色、圆角等设计变量，但需要搭建构建流程。也可以通过在线主题编辑器生成主题包，然后按需引入。
4. 【回答框架 4】需要注意样式优先级问题：查看元素计算样式，确认覆盖规则权重；避免使用 !important 过度，否则难以维护；当使用弹窗、下拉等挂载到 body 的组件时，scoped 无法生效，需要使用全局样式或挂载到组件根节点。
5. 【关键点 1】深选择器：Vue 2 用 ::v-deep，Vue 3 用 :deep()，实现 scoped 下覆盖子组件样式。
6. 【关键点 2】全局覆盖需注意样式引入顺序，确保覆盖样式的文件在 Element 样式之后。
7. 【关键点 3】主题定制通过修改 SCSS 变量实现，适合批量修改颜色、圆角等设计变量。
8. 【关键点 4】处理挂载到 body 的组件（如弹窗）时，scoped 失效，需用全局样式或挂载点调整。
9. 【易错点 1】滥用 !important 导致样式难以覆盖，应优先提高选择器权重。
10. 【易错点 2】scoped 样式直接写子组件类名可能无效，必须使用深度选择器。
11. 【易错点 3】主题定制中若未正确编译 SCSS，可能导致样式丢失，应确保构建配置正确。