微信小程序里使用weui的正确打开方式

自己写微信小程序,发现有weui这样的东西。第一次使用,网上搜到到用法是这样的:

https://weui.io/#input查看例子,右键查看源码,然后再对照界面和源码使用。

但是这样看到的源码是网页版的,不是小程序风格的代码。另外,源码和界面也不好对应。

实际上,如果是开发微信小程序或者公众号,使用的是微信web开发者工具,weui的正确打开方式是这样的:

  • 下载weui

项目地址:https://github.com/weui/weui-wxss/

  • 使用微信web开发者工具,新建项目,并选择下载的weui的解压后的文件夹里的dist目录。
  • 然后就能以项目的形式查看weui了。
  • 这样查看某个组件的用法就方便多了,而且也有对应js文件,可以查看模拟数据的处理方式。
  • 如果在自己的项目里使用,需要把下载的weui文件夹下的dist目录下的weui.wxss文件找到,拷贝到自己的项目里,可以和例子一样,建一个文件夹style,把weui.wxss文件放进去。然后在自己的项目的app.wxss文件里引用这个文件。

  • 然后在你的项目里就可以使用weui风格的组件了。
  • 17
    点赞
  • 46
    收藏
    觉得还不错? 一键收藏
  • 5
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 5
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值