uni-app中的uni.requireNativePlugin()

这个方法是用来引入原生插件的方法,自 HBuilderX 1.4 版本起,uni-app 支持引入原生插件,使用方式如下:

const PluginName = uni.requireNativePlugin(PluginName); // PluginName 为原生插件名称

引入插件的类型有三种:

  1. 内置原生插件:

        内置原生插件,uni-app已默认集成,支持直接在内置基座运行。

        仅在nvue页面,支持引入BindingX,animation, DOM.addRule等。

        在vue页面,支持引入clipboard,storage,stream,deviceInfo等。

        使用方式:可通过uni.requireNativePlugin直接使用。

<template><view><text class="my-iconfont">&#xe85c;</text>	</view></template><script>export default{beforeCreate() {const domModule = uni.requireNativePlugin('dom')domModule.addRule('fontFace', {'fontFamily': "myIconfont",'src': "url('http://at.alicdn.com/t/font_2234252_v3hj1klw6k9.ttf')"});}}</script><style>.my-iconfont {font-family:myIconfont;font-size:60rpx;color: #00AAFF;}</style>

2.本地插件

本地插件存放的位置为,uni-app项目nativeplugins目录(目录不存在则创建)下的原生插件。

步骤如下:

(1)获取本地原生插件,放在自己的项目中:

 将插件放到nativeplugins文件夹中

(2)配置本地原生插件

打开自己项目的manifest.json文件夹

上面两步操作完了之后就弹出这个框,选择需要的插件之后点击确定就可以了

 

 (3)开发调试本地原生插件

const dcRichAlert = uni.requireNativePlugin('DCloud-RichAlert')//DCloud-RichAlert为插件的ID

(4)打包发布

使用自定义基座开发调试本地原生插件之后,不可以直接将自定义基座的APK作为正式版发布,应该重新打包成正式的。

3.云端插件

已经在插件市场绑定或者购买的插件,不需要下载插件到工程中,云打包时会直接合并并打包到原生APP中

(1)购买或者下载原生uni-app插件

(2)配置云端插件

 

 在这个选择框里选择需要的插件

(3)开发调试uni-app原生插件

在vue或者nvue页面引入原生插件,使用uni.requireNativePlugin的api,参数为插件的id。

1.在页面引入原生插件,uni.requireNativePlugin 使用后返回一个对象:

const dcRichAlert = uni.requireNativePlugin('DCloud-RichAlert')

2.使用原生插件

dcRichAlert.show({position: 'bottom',title: "提示信息",titleColor: '#FF0000',content: "<a href='https://uniapp.dcloud.io/' value='Hello uni-app'>uni-app</a> 是一个使用 Vue.js 开发跨平台应用的前端框架!\n免费的\n免费的\n免费的\n重要的事情说三遍",contentAlign: 'left',checkBox: {title: '不再提示',isSelected: true},buttons: [{title: '取消'}, {title: '否'}, {title: '确认',titleColor: '#3F51B5'}]}, result => {console.log(result)});

详情请前往uni-app官网:uni-app官网

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/9118.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

东南大学齿轮箱故障诊断(Python代码,CNN结合LSTM模型)

运行代码要求&#xff1a; 代码运行环境要求&#xff1a;Keras版本>2.4.0&#xff0c;python版本>3.6.0 1.东南大学采集数据平台&#xff1a; 数据 该数据集包含2个子数据集&#xff0c;包括轴承数据和齿轮数据&#xff0c;这两个子数据集都是在传动系动力学模拟器&am…

如何将电机控制器添加到您的 ROS 机器人

一、说明 如果您正在构建与 ROS/ROS2 一起使用的移动机器人,您需要做的第一件事就是集成电机控制器。电机控制器的目的是接受来自更高级别的软件(如导航堆栈)的消息,并将其转换为驱动电机的信号。它还将从电机的编码器接收信息,以计算机器人的速度和位置。 您可以…

WebGPU(七):C++头部封装

WebGPU(七)&#xff1a;C头部封装 在前面的学习中&#xff0c;我们使用的都是原生态的WebGPU API&#xff0c;那是基于C语言的API&#xff0c;但是为了更高效的开发&#xff0c;我们可以使用一个基于C的库。 根据参考的教程&#xff0c;这个github库提供更加纤细的描述。它提…

【计算机网络】计算机网络基础知识总结(秋招篇)

文章目录 前言计算机网络笔记TCP和UDP分别是什么 有什么区别基于TCP UDP这两个协议的上层协议有哪些&#xff1f;TCP和UDP分别在哪些领域被用的多&#xff1f;TCP实现可靠性传输用了哪些技术&#xff1f;&#xff08;TCP如何实现可靠性传输&#xff09;讲一下超时重传和超时定时…

全志F1C200S嵌入式驱动开发(触摸屏驱动)

【 声明:版权所有,欢迎转载,请勿用于商业用途。 联系信箱:feixiaoxing @163.com】 触摸屏一般有两种,一种是电阻触摸屏,一种是电容触摸屏。前者需要自己买一颗i2c的信号读取芯片,用的比较多的是ns2009。后者自身集成了读取芯片,用的比较多的是gt911。正好之前测…

使用 HostAliases 向 Pod /etc/hosts 文件添加条目

某些情况下&#xff0c;DNS 或者其他的域名解析方法可能不太适用&#xff0c;您需要配置 /etc/hosts 文件&#xff0c;在Linux下是比较容易做到的&#xff0c;在 Kubernetes 中&#xff0c;可以通过 Pod 定义中的 hostAliases 字段向 Pod 的 /etc/hosts 添加条目。 适用其他方…

文件流,排序,下载

提示&#xff1a;文章写完后&#xff0c;目录可以自动生成&#xff0c;如何生成可参考右边的帮助文档 文章目录 字符字节流&#xff0c;前升后降一、pandas是什么&#xff1f; 字符字节流&#xff0c;前升后降 浏览器下载需要设置两个头 responese .setHeader() 一个设置返回的…

C# Modbus TCP上位机测试

前面说了三菱和西门子PLC的上位机通信&#xff0c;实际在生产应用中&#xff0c;设备会有很多不同的厂家生产的PLC&#xff0c;那么&#xff0c;我们就需要一种通用的语言&#xff0c;进行设备之间的通信&#xff0c;工业上较为广泛使用的语言之一就是Modbus。 Modbus有多种连…

Pytorch从入门到精通:二、dataset与datalodar

数据是深度学习的基础&#xff0c;一般来说&#xff0c;数据量越大&#xff0c;训练出来的模型也越强大。如果现在有了一些数据&#xff0c;该怎么把这些数据加到模型中呢&#xff1f;Pytorch中提供了dataset和dataloader&#xff0c;让我们一起来学习一下吧&#xff0c;datase…

5-linux中的定时任务调度

定时任务调度 crond 任务调度概述基本语法常用选项快速入门应用实例crond 相关指令 at 定时任务基本介绍at 命令格式at 命令选项at 时间的定义其他指令 crond 任务调度 crontab 进行 定时任务调度 概述 任务调度&#xff1a;是指系统在某个时间执行的特定的命令或程序 任务…

Webpack5 vue-loader和VueLoaderPlugin

文章目录 vue-loader和VueLoaderPlugin的作用vue-loader具体使用方式注意事项 vue-loader和VueLoaderPlugin的作用 .vue 文件是用户用 HTML-like 的语法编写的 Vue 组件。每个vue 文件都包括三部分 , VueLoaderPlugin 是一个解析 Vue.js 的插件&#xff0c;用于在 webpack 构…

360T7路由器进行WiFi无线中继教程

360T7路由器进行WiFi中继教程 1. 概述2. 360T7路由器进行WiFi中继实现教程2.1 登录路由器管理界面2.2 选择上网方式2.3 搜索WiFi2.4 连接WiFi2.5 点击确认2.6 在主页面查看网络 1. 概述 中继路由系统由一组中继路由器组成&#xff0c;为不能交换路由信息的路由域提供中继路由。…

Docker consul的容器服务更新与发现

&#xff08;1&#xff09;什么是服务注册与发现 服务注册与发现是微服务架构中不可或缺的重要组件。起初服务都是单节点的&#xff0c;不保障高可用性&#xff0c;也不考虑服务的压力承载&#xff0c;服务之间调用单纯的通过接口访问。直到后来出现了多个节点的分布式架构&am…

STP和MTP(第二十二课)

2、如何实现 1)在MSTP网络种,引入了域的概念,称为MST域 2)每一个MST域中包含一个或多个“生成树”称为“实例” 3)每个“实例生成树”都可以绑定vlan,实现vlan数据流的负载分担/负载均衡 4)默认情况下,所有的vlan都属于“实例树0:即:instance 0” 5)不同的“实例…

centos 8安装A10显卡驱动-AI人工智能

centos 8安装A10显卡驱动命令:./NVIDIA-Linux-x86_64-535.54.03.run --kernel-source-path/usr/src/kernels/4.18.0-147.el8.x86_64 安装完毕; 测试: 检查驱动版本号: nvidia-smi 验证驱动模块已加载: lsmod | grep nvidia

【Vue3】生命周期

beforeCreate&#xff0c;created 在setup 语法糖模式下是没有这两个生命周期的 App.vue <template><h1>Hello World</h1><!-- 通过v-if控制组件创建和销毁的生命钩子 --><A v-if"flag"></A><button click"flag !fla…

【腾讯云 Cloud Studio 实战训练营】沉浸式体验编写一个博客系统

文章目录 前言新建工作空间登录(注册)Cloud Studio 账号&#xff1a;进入 Cloud Studio 控制台&#xff1a;配置工作空间参数&#xff1a;确认并创建工作空间&#xff1a;项目搭建 配置nuxt 脚手架运行项目报错信息解决错误脚手架运行预览问题 开启博客代码配置layout首页配置 …

Python - OpenCV、OCR识别摄像头中的文字

使用Python3的OpenCV库来识别摄像头中的文字&#xff0c;以及使用OCR&#xff08;光学字符识别&#xff09;技术。 安装OpenCV库 在命令行中输入以下命令来安装OpenCV库&#xff1a; pip install opencv-python安装Tesseract OCR库 Tesseract OCR库是一种免费的光学字符识别…

JVM理论(六)执行引擎--垃圾回收

概述 垃圾: 指的是在运行程序中没有任何指针指向的对象垃圾回收目的: 为了及时清理空间使得程序可以正常运行垃圾回收机制: JVM采取的是自动内存管理,即JVM负责对象的创建以及回收,将程序员从繁重的内存管理释放出来,更加专注业务的开发垃圾回收区域: 频繁收集Young区(新生代)…

Docker运行MySQL5.7

步骤如下&#xff1a; 1.获取镜像&#xff1a; docker pull mysql:5.7 2.创建挂载目录&#xff1a; mkdir /home/mydata/data mkdir /home/mydata/log mkdir /home/mydata/conf 3.先启动docker把配置文件拷贝出来&#xff1a; docker run -it --name temp mysql:5.7 /bi…