从 uniapp 官方可知在 HbuilderX 2.4.7起,h5 和 小程序的组件实现了共享
uniapp 引入 vant weapp
在项目目录
- 在项目目录下新建
wxcomponents
文件夹
- 如果是通过
HbuilderX
建的项目,则在项目根目录新建wxcomponents
文件夹 - 如果是通过脚手架创建的项目,在
src
目录中新建wxcomponents
文件夹
- 进入
vant
组件官网
vant 入口 - 通过
npm/yarn
下载下来或者直接到github
找到构建好的目录 dist - 将 dist 目录复制到
wxcomponents
文件夹内 - 将 dist 重命名为
vant
或者其他
使用 vant weapp 组件
-
在
pages.json
中使用usingcomponents
-
直接在
vue
文件中通过import
导入注册即可(推荐)
在h5 和小程序中即可正常使用。
注意点
- 使用时
H5
如果报关于 van-icon css 文件的错误,请手动格式化一下van-icon 下的 css 文件 - 在使用组件,监听事件无法获取参数,请在事件后加上
.native
即可
onTabsChange
函数无法获取到文档中提及到回调参数
正确调用方式