定制主题

Css变量 的兼容性要求可以在 这里 查看。对于不支持 Css变量 的设备，定制主题将不会生效，不过不必担心，默认样式仍会生效。

  默认按钮
</van-button>

.my-button {
  --button-border-radius: 10px;
  --button-default-color: #f2f3f5;
}

Page({
  data: {
    buttonStyle: `
      --button-default-color: green;
    `
  },
    setTimeout(() => {
      this.setData({
        buttonStyle: `
          --button-border-radius: 2px;
          --button-default-color: pink;
        `
      });
    }, 2000);
  }
});

<view class="container">
    默认按钮
  </van-button>
  <van-toast id="van-toast" />
</view>

.container {
  --button-border-radius: 10px;
  --button-default-color: #f2f3f5;
  --toast-max-width: 100px;
  --toast-background-color: pink;
}

page {
  --button-border-radius: 10px;
  --button-default-color: #f2f3f5;
  --toast-max-width: 100px;
  --toast-background-color: pink;