微信小程序 不只能使用腾讯提供的组件,但它的开发方式有一定的限制。下面详细解释:
✅ 微信小程序可以使用的组件类型
1. 官方内置组件(WXML 组件)
这是微信小程序原生支持的一套组件,如:
viewtextimagebuttoninput- 等等
这些组件是通过 WXML 编写的,具有良好的性能和兼容性,推荐优先使用。
文档地址:https://developers.weixin.qq.com/miniprogram/dev/component/
2. 自定义组件
你可以自己编写组件,并在多个页面中复用。这类似于 Vue 或 React 的组件化开发模式。
使用方法:
-
在项目配置中开启自定义组件支持(默认已开启):
{ "usingComponents": {} } -
创建自己的组件目录结构,比如:
components/ my-button/ my-button.js my-button.json my-button.wxml my-button.wxss -
在页面 JSON 中引用该组件:
{ "usingComponents": { "my-button": "/components/my-button/my-button" } } -
在 WXML 页面中使用:
<my-button text="点击我" bindtap="onClick"></my-button>
3. 第三方组件库
虽然不能直接使用 Web 前端的 UI 框架(如 Vue、React、Element UI),但有一些专为小程序设计的 UI 库可以直接使用,例如:
| 名称 | 说明 |
|---|---|
| WeUI | 微信官方 UI 样式库 |
| Vant Weapp | Vant 的小程序版本 |
| WePY UI | 支持 WePY 框架的小程序 UI 组件库 |
| Taro UI | Taro 框架下的多端 UI 组件库 |
| MinUI | 小米开源的小程序组件库 |
这些组件库大多基于微信小程序的自定义组件机制实现。
4. 使用框架开发小程序
如果你习惯使用 Vue / React 风格的开发方式,可以借助以下框架来开发微信小程序:
| 框架名称 | 类似于 | 说明 |
|---|---|---|
| Taro | React | 多端统一开发框架 |
| UniApp | Vue | 支持编译到微信小程序等多个平台 |
| Mpvue | Vue | 已逐渐被 UniApp 替代 |
| WePY | 类 Vue | 早期流行的微信小程序开发框架 |
这些框架允许你使用熟悉的语法开发小程序,并且可以使用它们配套的 UI 组件库。
❌ 微信小程序不能做什么?
- 不能直接使用 HTML/CSS/JS 开发界面。
- 不能使用浏览器中的 DOM API(如
document.getElementById)。 - 不能直接使用 Web 的前端 UI 框架(如 Element UI、Bootstrap),除非经过适配或封装。
✅ 总结
| 问题 | 回答 |
|---|---|
| 微信小程序只能使用腾讯提供的组件吗? | ❌ 不是,可以使用自定义组件、第三方组件库,也可以使用框架(如 Taro、UniApp)进行开发 |
| 能否使用 Vue/React 风格开发? | ✅ 可以,借助 Taro、UniApp 等框架 |
| 能否引入外部 UI 库? | ✅ 可以,有专门的小程序 UI 库可用 |
| 能否使用 Web 的前端组件库? | ❌ 不行,需要适配或使用专用版本 |
如需进一步了解如何引入第三方组件库或使用框架开发小程序,我可以提供详细步骤和示例代码 😊
CLOUD技术博