微信小程序引入第三方UI组件

微信小程序引入第三方UI组件,第1张

需要引入第三方UI组件  Vant-Weapp

打开终端,输入cd 拖拽项目文件到终端,然后输入命令npm init

此时,输入package name名称,一直点回车就行

出现Is this OK?(yes),直接回车即可

在终端输入命令npm i vant-weapp -S --production

在回过头看,在微信小程序开发工具中会多一个文件package.json,在这里面就可以进行包的配置。

这个时候可以在项目文件夹中看见一个新生成的文件夹miniprogram_npm,其中就有我们刚刚安装好的vant组件库

这里要注意,一定是将引入的第三方组件写入“usingComponents”的字典中,如果写成平级的话,会提示page.json [vant-button]无效

<vant-button type="danger">微信登陆</vant-button>

微信小程序开发,是目前火爆的开发方式,也是适应中小企业快速解决的一个方案。选择一个合适自己的开发UI框架,能够让自己开发速度提升数倍。

推荐两个小程序UI框架:

WeUI

WeUI是由微信官方设计团队分别支持微信H5网页和微信原生小程序的开源UI组件

ColorUI

ColorUI是开源且支持原生小程序的UI组件,由于我目前在帮朋友改一个原生的微信小程序,所以就选择了这款开源组件。

项目需求:

想要知道如何在uniapp项目中引入使用小程序ui-vant weapp组件,首先得了解如果在uniapp项目中使用小程序组件

微信小程序组件 需要放在项目特殊文件夹 wxcomponents 。

在 pages.json 对应页面的 style ->usingComponents 引入组件:

在页面中使用

我对这句话的理解是:

而我们想在uniapp项目中使用vant weapp微信小程序组件的诉求,其实是想在项目中任何位置都可以使用vant组件,所以我们需要全局注册vant小程序组件

https://vant-contrib.gitee.io/vant-weapp/#/quickstart

并不需要注册所有的,你使用那个组件注册那个就行

注意事项:


欢迎分享,转载请注明来源:内存溢出

原文地址:https://54852.com/yw/10924147.html

(0)
打赏 微信扫一扫微信扫一扫 支付宝扫一扫支付宝扫一扫
上一篇 2023-05-12
下一篇2023-05-12

发表评论

登录后才能评论

评论列表(0条)

    保存