微信小程序简单使用拓展组件库方法

短命女 2022-12-01 03:55 241阅读 0赞

## 微信小程序使用拓展组件库 ##

方式：通过 [useExtendedLib 扩展库][useExtendedLib] 的方式引入

方法：在全局`app.json`中添加

"useExtendedLib": {
        
    
      "kbone": true,
    
      "weui": true
    
     }

好处：**在使用时可省略 import 步骤（相对于`npm`构建来说）**

使用：

先在所要引用的页面的`json`文件中添加对应组件名称（不需要在wxss中导入）

例：

{
        
      "usingComponents": {
        
        "mp-cells": "weui-miniprogram/cells/cells",
        "mp-cell": "weui-miniprogram/cell/cell",
        "mp-slideview": "weui-miniprogram/slideview/slideview"
      }
    }

然后在`WXML`中像基础组件一样使用即可。

例：

<mp-cells>
                <mp-cell link value="我的喜欢">
                    <image slot="icon" src="{
         {icon}}" style="margin-right: 16px;vertical-align: middle;width:20px; height: 20px;"></image>
                </mp-cell>
                <mp-cell link url="../collection/collection" value="我的收藏" footer="说明文字">
                    <image slot="icon" src="/miniprogram/images/about.png" style="margin-right: 16px;vertical-align: middle;width:50rpx; height: 50rpx;"></image>
                </mp-cell>
    </mp-cells>

补充(qaq)：如果要使用`WeUI`的拓展组件只能使用`npm`构建的方式（因为这两种方式是冲突的）。

[useExtendedLib]: https://developers.weixin.qq.com/miniprogram/dev/reference/configuration/app.html#useExtendedLib

发表评论取消回复

表情：

评论列表（有 0 条评论，241人围观）

还没有评论，来说两句吧...

相关阅读

相关微信小程序如何使用第三方组件库

在实际开发中通常会为了节约时间来使用第三方的组件库，这里演示小程序如何使用利用npm使用vant组件库 ①初始化在项目的根目录右键，点击在终端打开，进入终端输入npm

忘是亡心i/ 2023年06月07日 12:20/ 0 赞/ 115 阅读

相关微信小程序组件库 iView Weapp使用教程

微信UI组件库 iView Weapp 介绍：iView Weapp 提供了与 iView 一致的 UI 和尽可能相同的接口名称，大幅度降低了学习成本，是一套一套高质量的

太过爱你忘了你带给我的痛/ 2022年12月05日 10:20/ 0 赞/ 594 阅读

相关微信小程序 WeUI 之拓展组件tabs的引用。

微信小程序 WeUI 使用拓展组件tabs方法注意：不能使用引入[useExtendedLib 扩展库][useExtendedLib] 的方式，而是用npm构建的方

古城微笑少年丶/ 2022年12月02日 01:08/ 0 赞/ 1116 阅读

相关微信小程序简单使用拓展组件库方法

微信小程序使用拓展组件库方式：通过 [useExtendedLib 扩展库][useExtendedLib] 的方式引入方法：在全局`app.json`中添加

短命女/ 2022年12月01日 03:55/ 0 赞/ 242 阅读

相关微信小程序-组件悬浮

字节跳动校招内推码: C4BDSMC 投递链接: https://job.toutiao.com/s/J691fRK 内推交流QQ群：104917572

男娘i/ 2022年05月18日 05:49/ 0 赞/ 384 阅读

相关微信小程序视频组件简单使用

wxml中： <view wx:for="{ {fen}}" wx:key="key"> <view><text>{ {item

绝地灬酷狼/ 2022年01月14日 07:23/ 0 赞/ 337 阅读

相关微信小程序使用第三方组件库

使用vant weapp来快速构建小程序 1.首先在项目文件夹下使用npm init 生成一个package.json的配置文件 2.然后输入组件提供的快速初始

妖狐艹你老母/ 2022年01月11日 00:43/ 0 赞/ 337 阅读

相关微信小程序 - 组件

> 微信小程序为开发者提供了一系列基础组件，使开发者可以进行快速开发。同时还支持自定义组件，提升代码复用性，有助于代码维护。一、基础组件 > 基础组件主要分为：视图容

深碍√TFBOYSˉ_/ 2021年12月05日 17:47/ 0 赞/ 582 阅读

相关微信小程序-组件

1.轮播图 <swiper indicator-dots="{ {indicatorDots}}" indicator-color="{

客官°小女子只卖身不卖艺/ 2021年11月30日 00:56/ 0 赞/ 548 阅读

相关微信小程序地图组件

[完整微信小程序(Java后端) 技术贴目录清单页面（必看）][Java_] 地图（v2.7.0 起支持[同层渲染][Link 1]，相关api [wx.createMapC

﹏ヽ暗。殇╰゛Y/ 2021年09月08日 07:14/ 0 赞/ 1019 阅读