扫二维码与项目经理沟通
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流
注册账号
安装开发工具
微信小程序的代码由以下核心文件组成:
.json
:配置文件(如全局配置 app.json
、页面配置等)。.wxml
:类似 HTML 的页面结构。.wxss
:类似 CSS 的样式文件(支持部分 CSS3 语法)。.js
:逻辑处理文件(页面生命周期、事件等)。示例目录结构:
├── app.js # 小程序入口文件 ├── app.json # 全局配置(窗口样式、页面路径等) ├── app.wxss # 全局样式 ├── pages/ # 页面目录 │ ├── index/ │ │ ├── index.wxml │ │ ├── index.js │ │ ├── index.json │ │ └── index.wxss │ └── logs/ └── utils/ # 工具类文件
WXML 与数据绑定
{{ }}
绑定数据到视图,如 <view>{{message}}</view>
。wx:if="{{condition}}"
。wx:for="{{list}}" wx:key="id"
。WXSS 样式
rpx
单位(自适应屏幕宽度,1rpx ≈ 0.5px)。.wxss
优先级高于全局 app.wxss
)。JavaScript 逻辑
onLoad
, onShow
, onReady
(页面)和 onLaunch
, onHide
(全局)。wx
对象调用微信能力。组件库
<view>
, <text>
, <button>
, <input>
, <navigator>
(跳转链接)等。Component
创建可复用的 UI 模块。本地调试
真机测试
提交审核与发布
云开发(无需后端)
wx.cloud.callFunction
调用云函数。开放接口
wx.login
获取用户凭证。wx.requestPayment
接入微信支付。onShareAppMessage
自定义分享内容。性能优化
setData
频率,避免传输大数据。我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流