Posted on
2020-05-18 08:53 
张雪冬前端学习园地 
阅读(…) 
评论(…) 
编辑 
收藏

Vant Weapp—UI库使用

 

1.介绍：是一个专门为小程序打造的UI组件库

  1. // 安装组件库
  3. npm i @vant/weapp -S --production
  4.  
  5. /*
  7.     注意：小程序使用npm安装的包，需要做以下俩步
  10.     1.在微信开发工具中的详情中的本地设置，勾选使用npm模块
  13.     2.在微信开发工具中菜单中的，构建npm才可以使用
  14. */
  15.  
  16.  
  17.  
  18.  
  19.  
  20. // 在页面组件中使用ui组件
  21.  
  22.  
  23. // 1.全局注册ui组件，在app.json中注册，usingComponents中注册组件
  26. {
  28.     "usingComponents": {
  30.         "van-tabbar": "@vant/weapp/tabbar/index",
  32.         "van-tabbar-item": "@vant/weapp/tabbar-item/index",
  33.     }
  34. }
  38. // 2.局部注册，也就是在自己的页面组件中注册，在index.json配置，这样就只能在当前页面组件中使用了
  41. {
  43.     "usingComponents": {
  45.         "van-tabbar": "@vant/weapp/tabbar/index",
  47.         "van-tabbar-item": "@vant/weapp/tabbar-item/index",
  48.     }
  49. }

 

 

 

版权声明：本文为zxuedong原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://www.cnblogs.com/zxuedong/p/12908608.html