微信小程序mpvue项目使用WuxWeapp前端UI组件

前言:这是一篇简单粗暴的使用指南

在最近的小程序项目里前端UI框架最后选择使用WuxWeapp,这篇文章记录一下如何在小程序mpvue项目中使用该UI组件。css

步骤一:下载源码

地址在这里
主要是里面的dist文件夹,下载下来以后就把dist文件夹放到mpvue脚手架自动生成的static文档中。具体的目录层级各位均可以按本身的喜爱来设计。贴上个人仅供参考。html

clipboard.png

步骤二:引入组件

咱们须要在app.json文件中进行配置,其中有一个"usingComponents"配置属性。须要使用什么组件,按需引入就行。配置以下:前端

clipboard.png

步骤三:使用组件

最后就是使用啦,该UI组件也有官方的文档,已经写得很详细了。vue

clipboard.png


Tips:git

  • 小程序的限制
    因为小程序的定位是轻、快、小吧,因此小程序的代码包的大小也是有限制的,一个包不能超过2M。因此,咱们引入到项目中的wux组件的代码小程序也会进行编译于是增长了代码包的大小,因此最好仍是按需使用。
  • 如何在Wux的基础上自定义样式
    好比我想在wux修改wux按钮组件的颜色,由于这种行为是会存在的,可能项目需求要按钮就得是一种特定的颜色,并且咱们想直接写css来修改颜色也有点困难。那么不妨,咱们能够从组件源码下手,其实加个背景颜色什么的还算是简单的,只要在wxss文件里加一个css 的class就差很少了…这一直是其中一种思路,其实也给了咱们机会去看看别人是如何实际出一个UI组件库的。(我想咱们大多数人都是用过,却不多看过代码八)
  • 更新(2019-4-18)
    对于第二点改源码这种事情仍是太粗暴了,咱们能够找到组件的css类修改之。指路

写到这里,但愿能对你有帮助(#^.^#)github

相关文章
相关标签/搜索