Uniapp接入插件的三种方式
创始人
2024-12-28 17:33:54
0

Uniapp接入插件的三种方式


文章目录

  • Uniapp接入插件的三种方式
  • 前言
  • 一、使用HBuilderX导入插件
    • 1.找到所需插件
    • 2.导入插件
    • 3.使用插件
  • 二、通过uni_modules单独安装插件
    • 1.创建uni_module目录
    • 2.下载并安装插件
    • 3.使用插件
  • 三、通过components单独安装组件
    • 1.创建components目录
    • 2.下载并安装插件
    • 3.导入插件
    • 4.定义插件
    • 5.使用插件


前言

我这里的学习例子使用uni-badge这个插件,其他的插件也是类似的引入方式,大多数插件文档中也包含使用方法。


一、使用HBuilderX导入插件

提示:这个方法需要登录HBuilderX

1.找到所需插件

在插件市场找到自己所需插件,我举例插件为uni-badge。点击下载进入到具体插件页面,如下所示
数字角标插件

2.导入插件

点击【使用HBuilderX导入插件】按钮,然后选择需要导入的项目
选择导入项目
之后,自动生成uni_modules目录,并下载
自动生成目录

3.使用插件

直接就可以在页面中使用了
页面使用插件
效果如下:
使用效果

二、通过uni_modules单独安装插件

1.创建uni_module目录

我这边是没有创建uni-ui模块的,则需要现在自己项目下创建目录uni_module
自定义uni-module模块

2.下载并安装插件

然后点击【下载插件ZIP】下载相应的组件,如图所示
提示:这个【下载插件ZIP】按钮需要在非登录状态下才能出现
下载插件
解压插件
在这里插入图片描述
将components中的uni-badge目录直接复制到项目的uni_modules中

3.使用插件

可以直接在页面上使用了,无需另外的引用和注册组件
使用组件
效果如图
在这里插入图片描述

三、通过components单独安装组件

1.创建components目录

在项目中创建components目录
自定义目录

2.下载并安装插件

下载插件
在这里插入图片描述
解压插件
解压插件
将components中的uni-badge目录直接复制到项目的components中

3.导入插件

假设 page-a.vue 页面需要用到 badge,则在 page-a.vue 的 script 节点下导入 badge 组件,如下:

import uniBadge from "@/components/uni-badge/uni-badge.vue" 

4.定义插件

在 components 选项中定义 badge 组件,如下:

export default {       data() {           return { /* ... */ }       },       components: {           uniBadge       }   }  

提示:若从插件市场下载使用多个组件,则每个组件均需在 components 选项中定义,并以逗号分隔。

5.使用插件

使用组件
在 template 节点按照组件使用说明,调用组件并传值,如下:

     

效果如下

使用插件

相关内容

热门资讯

专业讨论!德扑之星真破解套路(... 专业讨论!德扑之星真破解套路(辅助挂)软件透明挂(有挂了解)-哔哩哔哩;人气非常高,ai更新快且高清...
每日必看!智星德州菠萝外挂检测... 每日必看!智星德州菠萝外挂检测(辅助挂)软件透明挂(有挂教学)-哔哩哔哩1、玩家可以在智星德州菠萝外...
透视透明挂!轰趴十三水有后台(... 轰趴十三水有后台赢率提升策略‌;透视透明挂!轰趴十三水有后台(辅助挂)软件透明挂(有挂详情)-哔哩哔...
发现玩家!德扑ai助手软件(辅... 发现玩家!德扑ai助手软件(辅助挂)透视辅助(有挂教学)-哔哩哔哩;玩家在德扑ai助手软件中需先进行...
一分钟了解!x-poker辅助... 一分钟了解!x-poker辅助软件(辅助挂)辅助透视(有挂攻略)-哔哩哔哩1、每一步都需要思考,不同...
一分钟揭秘!德州最新辅助器(辅... 一分钟揭秘!德州最新辅助器(辅助挂)透视辅助(有挂攻略)-哔哩哔哩;德州最新辅助器最新版本免费下载安...
玩家攻略推荐!德州辅助(辅助挂... 玩家攻略推荐!德州辅助(辅助挂)辅助透视(有挂了解)-哔哩哔哩是由北京得德州辅助黑科技有限公司精心研...
揭秘真相!pokernow德州... 《揭秘真相!pokernow德州(辅助挂)辅助透视(有挂介绍)-哔哩哔哩》 pokernow德州软件...
五分钟了解!德州之星辅助器(辅... 五分钟了解!德州之星辅助器(辅助挂)辅助透视(有挂透明)-哔哩哔哩1、很好的工具软件,可以解锁游戏的...
推荐一款!pokermaste... 1、推荐一款!pokermaster有外挂(辅助挂)透视辅助(有挂教学)-哔哩哔哩;详细教程。2、p...