微信小程序常见的UI框架/组件库总结

article/2025/9/10 15:52:32
5640239-d41d7c476d338e97.png
图片

想要开发出一套高质量的小程序,运用框架,组件库是省时省力省心必不可少一部分,随着小程序日渐火爆,各种不同类型的小程序也渐渐更新,其中不乏一些优秀好用的框架/组件库。

1:WeUI 小程序–使用教程

https://weui.io/

官方介绍:WeUI 是一套同微信原生视觉体验一致的基础样式库,由微信官方设计团队为微信内网页和微信小程序量身设计,令用户的使用感知更加统一。小程序开发中最常用到的一款框架,受广大开发人员的欢迎。

5640239-82f8e61acddff533.png
图片.png

2:美团小程序框架mpvue

Github:https://github.com/Meituan-Dianping/mpvue
官网: http://mpvue.com/

官方介绍:mpvue是一个使用 Vue.js开发小程序的前端框架。框架基于 Vue.js核心,mpvue修改了 Vue.js的 runtime和 compiler实现,使其可以运行在小程序环境中,从而为小程序开发引入了整套Vue.js开发体验。

5640239-8b39f4afe3d6612a.png
图片.png

3:组件化开发框架wepy

Github地址:
https://github.com/Tencent/wepy
官网地址:
https://tencent.github.io/wepy

官方介绍:组件化开发,完美解决组件隔离,组件嵌套,组件通信等问题,支持使用第三方 npm 资源,自动处理 npm 资源之间的依赖关系,完美兼容所有无平台依赖的 npm 资源包.

5640239-1e64e4c7e2b9b121.png
图片.png

4:官方框架MINA

地址:https://developers.weixin.qq.com/miniprogram/dev/framework/MINA.html

官方介绍:框架提供了自己的视图层描述语言 WXML 和 WXSS,以及基于 JavaScript 的逻辑层框架,并在视图层与逻辑层间提供了数据传输和事件系统,可以让开发者可以方便的聚焦于数据与逻辑上。

5640239-7918b16afedbcec1.png
图片.png

5:Tina.js 一款轻巧的渐进式微信小程序框架

Tina.js 开源框架地址: https://github.com/tinajs/tina

官方介绍:是一款轻巧的渐进式微信小程序框架,保留 MINA (微信小程序官方框架) 的大部分 API 设计;无论你有无小程序开发经验,都可以轻松过渡上手。


5640239-3e05e476102e9576.png
图片.png

6:前端框架weweb

地址: https://github.com/wdfe/weweb

官方介绍:weweb是一个兼容小程序语法的前端框架,你可以用小程序的写法,来写web应用。如果你已经有小程序了,通过它你可以将你的小程序运行在浏览器中。

7:微信UI组件库 iView Weapp

https://weapp.iviewui.com/

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


5640239-0199c16af08dcf53.png
图片.png

8:ZanUI-WeApp -- 一个颜值高、好用、易扩展的微信小程序 UI 库

https://cnodejs.org/topic/589d625a5c8036f7019e7a4a

官方介绍:ZanUI-WeApp结合了微信的视觉规范,为用户提供更加统一的使用感受。 包含 badge、btn、等共计 17 类组件或元素。

原文作者:祈澈姑娘
技术博客:https://www.jianshu.com/u/05f416aefbe1

90后前端妹子,爱编程,爱运营,爱折腾。
坚持总结工作中遇到的技术问题,坚持记录工作中所所思所见,欢迎大家加入群聊,一起探讨交流。


http://chatgpt.dhexx.cn/article/qcCgG6RN.shtml

相关文章

强烈推荐:小程序常用的6款框架总结

随着前端的知识不断更新,小程序也成为了我们开发中的日常。微信小程序、百度小程序、支付宝小程序、头条小程序等等不断涌入我们的生活,随着小程序的火爆,各种小程序框架不断出现,也在不断更新。路漫漫,学不完呀&#…

微信小程序框架介绍以及项目目录结构

完整微信小程序(Java后端) 技术贴目录清单页面(必看) 微信小程序框架介绍 微信团队为小程序提供的框架命名为MINA。MINA框架通过封装微信客户端提供的文件系统、网络通信、任务管理、数据安全等基础功能,对上层提供一整套JavaScript API&am…

爬虫入门

爬虫入门 1. 概述 本文首先介绍Requests库如何自动爬取HTML页面以及如何自动网络请求提交,随后将会讲解如何阅读网络爬虫排除标准。获取了网页之后用BeautifulSoup库解析HTML页面,然后讲解正则表达式,以及如何用正则表达式提取网页关键信…

一个简单爬虫的入门教程

前言 我毕业论文要写文本大数据情绪分析,没有现成的数据。淘宝要价600块我又舍不得,只能自学爬虫。我一点计算机网络的基础都没有,光是入门就花了一周(不知道从何下手),所幸爬虫不难,只要见过就…

python爬虫入门教程:开始一个简单的爬虫

本文下面所有的Python基础都有详细的配套教程以及源码,都已经打包好上传到百度云了,链接在文章结尾处! 扫码此处领取大家自行获取即可~~~ 1.爬虫的过程分析 当人类去访问一个网页时,是如何进行的?   ①打开浏览器&…

从原理到实战,一份详实的 Scrapy 爬虫教程

之前分享了很多 requests 、selenium 的 Python 爬虫文章,本文将从原理到实战带领大家入门另一个强大的框架 Scrapy。如果对Scrapy感兴趣的话,不妨跟随本文动手做一遍! 一、Scrapy框架简介 Scrapy是:由Python语言开发的一个快速、高层次的屏幕…

超级简单的Python爬虫教程,python爬虫菜鸟教程官网

毫无基础的人如何入门 Python ? Python是一种计算机程序设计语言。你可能已经听说过很多种流行的编程语言,比如非常难学的C语言,非常流行的Java语言,适合初学者的Basic语言,适合网页编程的JavaScript语言等等。 那Python是一种…

爬虫教程(1)基础入门

爬虫介绍 网络爬虫,英译为 web crawler ,是一种自动化程序,现在我们很幸运,生处互联网时代,有大量的信息在网络上都可以查得到,但是有时我们需要网络上的数据,活着文章,图片等等&…

爬虫的简单入门

本文旨在教会读者能够简单使用两种爬虫,完成一些基础的爬虫操作,会给出一些优化思路,并不会深入的讲解优化方法。 目录 前言 一、爬虫部分——网页源码获取 1、Requests 2、Selenium 二、数据处理——解析网页 BeautifulSoup 三、成功入门之后…

网页爬虫教程

转自https://morvanzhou.github.io/tutorials/data-manipulation/scraping/ 了解网页结构 学习爬虫, 首先要懂的是网页. 支撑起各种光鲜亮丽的网页的不是别的, 全都是一些代码. 这种代码我们称之为 HTML, HTML 是一种浏览器(Chrome, Safari, IE, Firefox等)看得懂的语言, 浏览…

一个简单的爬虫入门教程!

前言 我毕业论文要写文本大数据情绪分析,没有现成的数据。淘宝要价600块我又舍不得,只能自学爬虫。我一点计算机网络的基础都没有,光是入门就花了一周(不知道从何下手),所幸爬虫不难,只要见过就…

【爬虫教程】吐血整理,最详细的爬虫入门教程~

初识爬虫 学习爬虫之前,我们首先得了解什么是爬虫。 来自于百度百科的解释: 网络爬虫(又称为网页蜘蛛,网络机器人,在FOAF社区中间,更经常的称为网页追逐者),是一种按照一定的规则&a…

爬虫教程( 1 ) --- 初级、基础、实践

爬虫教程:https://piaosanlang.gitbooks.io/spiders/content/ 1. 爬虫入门 初级篇 IDE 选择: PyCharm (推荐) 、SublimeText3、Visual Studio Python 版本:Python3。( 最简单的是直接安装 Anaconda,使用 Anaconda 管理…

python 爬虫 简单爬虫教程(requests + selenium )

最近改了实验室之前的爬虫,感觉有些生疏了,故此记录一下, 我将会通过抓取网站 https://nonfungible.com/ 来进行讲解。 目录 requests Chrome 浏览器使用Chrome 对目标网站信息进行解析requests get 请求requests 添加头requests ip代理 使用…

如何自学Python爬虫?详细的从入门到精通Python爬虫技能教程来了

如何自学Python爬虫?在大家自学爬虫之前要解决两个常见的问题,一是爬虫到底是什么?二是问什么要用Python来做爬虫?爬虫其实就是自动抓取页面信息的网络机器人,至于用Python做爬虫的原因,当然还是为了方便。…

Python爬虫入门教程:超级简单的Python爬虫教程

这是一篇详细介绍 [Python] 爬虫入门的教程,从实战出发,适合初学者。读者只需在阅读过程紧跟文章思路,理清相应的实现代码,30 分钟即可学会编写简单的 Python 爬虫。 这篇 Python 爬虫教程主要讲解以下 5 部分内容: …

python超简单爬虫教程

python超简单爬虫教程 python超简单爬虫教程七大步骤:1发送数据请求2请求网站源码3数据筛选4存储数据5数据可视化6数据分析7公司决策 python超简单爬虫教程 大家好!在这里给大家交流一下小编总结得python超简单爬虫教程,废话不多说&#xff…

如何入门 Python 爬虫?详细教程在这里

根据本人的习惯与理解,用最简洁的表述,介绍爬虫的定义、组成部分、爬取流程,并讲解示例代码。 基础 爬虫的定义:定向抓取互联网内容(大部分为网页)、并进行自动化数据处理的程序。主要用于对松散的海量信…

爬虫入门教程 —— 1

爬虫入门教程 -1 很想做一些爬虫的基础性的教程,来与大家共同分享我的一些小经验, 我将以我认为的方式为大家讲解网络爬虫,如果你没有编程基础,对网络爬虫有兴趣,开始可能稍微有一些小难度,不过我希望能给…

Python爬虫简单入门教程

这篇 Python 爬虫教程主要讲解以下 5 部分 了解网页结构;使用 requests 库抓取网站数据;使用 Beautiful Soup 解析网页;清洗和组织数据;爬虫攻防战; 了解网页结构 网页一般由三部分组成,分别是 HTML&#…