修改vant3内部组件样式

自定义 CSS 变量：

1.通过 CSS 覆盖。可以直接（在公共样式文件中）在代码中覆盖这些 CSS 变量，Button 组件的样式会随之发生改变：

/* 添加这段样式后，Primary Button 会变成红色 */
:root {
  --van-button-primary-background-color: red;
}

2.通过 ConfigProvider 覆盖。ConfigProvider 组件提供了覆盖 CSS 变量的能力，你需要在根节点包裹一个 ConfigProvider 组件 在需要改变样式的组件外，并通过 theme-vars 属性来配置一些主题变量。

**通过ConfigProvider修改vant组件中的样式：**

ConfigProvider：用于配置vant组件的主题样式和全局属性。vant组件通过丰富的css变量来组织样式，通过覆盖这些css变量，可以实现定制主题、动态切换主题的效果。

Vant 中的 CSS 变量分为 **基础变量** 和 **组件变量**。组件变量会继承基础变量，因此在修改基础变量后，会影响所有相关的组件。

由于 CSS 变量继承机制的原因，两者的修改方式有一定差异：

- 基础变量只能通过 `root 选择器` 修改，不能通过 `ConfigProvider 组件` 修改。
- 组件变量可以通过 `root 选择器` 和 `ConfigProvider 组件` 修改。

> 注意：ConfigProvider 仅影响它的子组件的样式，不影响全局 root 节点。