在 pages.json
的 globalStyle
中注册组件,所有页面均可使用:
{ "globalStyle": { "usingComponents": { "van-button": "/wxcomponents/@vant/weapp/button/index", "van-loading": "/wxcomponents/@vant/weapp/loading/index" } } }
若仅特定页面使用,可在对应页面的 pages.json
配置中单独注册:
{ "pages": [ { "path": "pages/index/index", "style": { "usingComponents": { "van-notify": "/wxcomponents/@vant/weapp/notify/index" } } } ] }
在 App.vue
中全局引入 Vant 的基础样式:
模板语法转换
Vant 组件基于微信小程序原生语法编写,需注意以下转换:
事件绑定:bind:click
→ @click
数据绑定:value="{{ data }}"
→ :value="data"
主要按钮