01-uniapp中的原生插件怎么用到项目中去

本文详细介绍了如何在uniapp中使用原生插件,包括项目初始化、安装插件、添加到项目、打包自定义基座及在项目中的应用,以文件分享插件为例,演示了从下载到集成的完整过程。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

一、项目初始化

如果已经有项目了,请跳过这步,在命令窗口中,输入这串指令,中间会弹出个让选模板的,我是选择了默认模板,可根据自己情况选择

1、新建项目

vue create -p dcloudio/uni-preset-vue my-app

在这里插入图片描述
到这一步就是新建成功了,按照指令进入项目和启动项目

2、使用HBuilder X打开项目

点击运行->运行到手机或模拟器->运行到Android App基座,我使用的是安卓的基座,如果自己用的是苹果的,可自行选择
在这里插入图片描述
点进去以后,可能搜索不到自己的手机设备,打开手机的开发人员选项->USB调试,如果打不开,可查看官网的解决方案,(https://uniapp.dcloud.net.cn/tutorial/run/run-app-faq.html#nomenu)如果像我这样的话,直接点击运行就可以了

在这里插入图片描述
运行成功以后,可以在自己的手机上看app的初始化界面
在这里插入图片描述
到这一步,项目初始化就完成了

二、插件使用

1、打开插件市场

打开插件市场(https://ext.dcloud.net.cn/?cat1=5&cat2=51&type=FreeHot&page=2),选择自己所需要的插件,
我这里以分享插件举例,我选择的是这个插件
在这里插入图片描述

2、下载插件

点进去以后,选择离线打包,打包好的是一个ZIP格式的文件夹
在这里插入图片描述
下载好的是一个压缩文件

3、添加到项目中

1、打开你的APP项目,直接建立nativeplugins这个文件夹
在这里插入图片描述
2、将刚才下载的解压好的插件包放到这个文件夹底下
在这里插入图片描述

3、在HBuilder X中打开manifest.json文件,点击APP原生插件配置->选择本地插件
在这里插入图片描述
4、这个时候就能看到有一个插件了,勾选以后选择确认
在这里插入图片描述

4、打包自定义基座

1、选择发行->原生App-云打包
在这里插入图片描述
2、如果有证书的话,可以选择使用自有证书,如果没有证书的话可以选择使用云端证书,然后选择打自定义调试基座,然后选择传统打包,记得把广告勾选都去掉,不要广告,都选择完成以后点击打包就可以
在这里插入图片描述
如果遇到这个报错,就打开manifest.json,选择源码试图,将permissions里面的android.permission.READ_CONTACTS去掉
在这里插入图片描述

5、运行自定义基座

1、打包完成以后会在控制台看到消息提示,有这个提示就是基座打包成功了
在这里插入图片描述

2、然后选择跟着图步骤走,运行的时候选择使用自定义基座
在这里插入图片描述
在这里插入图片描述

三、项目中使用

因为文件分享需要地址,所以我就不拿新项目举例了,新项目没有写接口地址,拿我已经完成的项目,前面的步骤都是一样的,
1、在页面中引用这个文件

const FileShare = uni.requireNativePlugin('life-FileShare');

直接写在这里就可以,贴一张图,避免不知道写的位置
在这里插入图片描述
2、点击一个按钮,传入当前项,我的v-if是用来判断是否显示的,就不展示了
在这里插入图片描述
2、我这里是先将文件下载了,因为接口地址啥的比较隐私,我这里就不放出来了,
使用了uni.downloadFile以后,会返回一个地址,然后调用FileShare.render方法,type里面QQ为QQ,微信为WX,系统默认是SYSTEM,如果接口中返回了地址也可以直接用,不必要使用这个uni,downloadFile 方法
在这里插入图片描述

四、效果

因为文件比较隐私,所以我就打个马赛克
在这里插入图片描述

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值