微信小程序之组件，API，框架_微信开发者工具里组件是什么-优快云博客

本文介绍了微信小程序的基础组件，包括视图容器、基础内容、表单、导航、多媒体、画布等七大类。同时，讲解了API的使用，如监听事件的wx.on开头的接口以及其他接受OBJECT参数的API。最后，概述了微信小程序的框架，包括WXML、WXSS视图层描述语言和JavaScript逻辑层，其核心是响应式数据绑定系统，实现了数据与视图的同步更新。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

组件

基础组件分为以下七大类：

什么是组件：

组件是视图层的基本组成单元。
组件自带一些功能与微信风格的样式。
一个组件通常包括开始标签和结束标签，属性用来修饰这个组件，内容在两个标签之内。

视图容器(View Container)：view scroll-view swiper

基础内容(Basic Content)：icon text progress

表单(Form)：button from input checkbox radio picker picker-view slider switch label

导航(Navigation)：navigation

多媒体(Media)：audio image video

地图(Map)：map

画布(Canvas)： canvas

API

wx.on 开头的 API 是监听某个事件发生的API接口，接受一个 CALLBACK 函数作为参数。当该事件触发时，会调用 CALLBACK 函数。
如未特殊约定，其他 API 接口都接受一个OBJECT作为参数。
OBJECT中可以指定success, fail, complete来接收接口调用结果。

本人觉得"发起请求   wx.request "  常用

wx.request({
  url: 'test.php', //仅为示例，并非真实的接口地址
  data: {
     x: '' ,
     y: ''
  },
  header: {
      'content-type': 'application/json' // 默认值
  },
  success: function(res) {
    console.log(res.data)
  }
})

框架

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

框架的核心是一个响应的数据绑定系统。

整个系统分为两块视图层（View）和逻辑层（App Service）

框架可以让数据与视图非常简单地保持同步。当做数据修改的时候，只需要在逻辑层修改数据，视图层就会做相应的更新。

var helloData = {
  name: 'WeChat'
}

// Register a Page.
Page({
  data: helloData,
  changeName: function(e) {
    // sent data change to view
    this.setData({
      name: 'MINA'
    })
  }
})

具体详细的学习请登录https://developers.weixin.qq.com/miniprogram/dev/index.html