微信小程序
1. .js（JavaScript 文件）
- 用途：
- 前端开发中用于实现页面逻辑、交互效果和数据处理。
- 在小程序开发中，负责页面的业务逻辑（如数据请求、事件响应）和小程序的生命周期管理。
- 示例场景：
- 网页中按钮点击事件触发的逻辑。
- 小程序中从服务器获取数据并渲染到页面。
2. .json（JSON 文件）
- 用途：
- 存储和传输结构化数据（键值对形式），常用于配置文件或数据交换。
- 在小程序中，用于配置页面路径、窗口样式、全局设置（如
app.json）或页面级配置（如page.json）。
- 示例内容：
json
{ "pages": [ "pages/index/index", "pages/logs/logs" ], "window": { "navigationBarTitleText": "小程序示例" } }
3. .wxml（WeiXin Markup Language，微信标记语言）
- 用途：
- 微信小程序的页面结构层，类似 HTML，用于描述页面的布局和组件。
- 通过标签（如
{{data}}、wx:if、wx:for）搭建页面结构。
- 特点：
- 基于 XML 语法，专为小程序设计，支持数据绑定和条件渲染。
- 与 JavaScript 逻辑层分离，通过
WXML模板引用JS中的数据。
- 示例代码：
wxml
当前时间：{{time}}
4. .wxss（WeiXin Style Sheet，微信样式表）
- 用途：
- 微信小程序的样式层，类似 CSS，用于定义页面的样式和布局（如颜色、字体、盒模型等）。
- 支持大部分 CSS 语法，并扩展了
rpx（响应式像素）等小程序特有的单位。
- 特点：
- 可通过类名（
class）或内联样式（style）应用样式。 - 支持全局样式（
app.wxss）和页面级样式（page.wxss），优先级遵循 CSS 规则。
- 可通过类名（
- 示例代码：
wxss
.container { display: flex; flex-direction: column; align-items: center; padding: 20rpx; background-color: #f0f0f0; } button { color: white; background-color: #1aad19; margin-top: 30rpx; }
总结对比
| 文件类型 | 作用领域 | 核心功能 | 类比对象 |
|---|---|---|---|
.js | 逻辑层 | 实现交互逻辑和数据处理 | JavaScript |
.json | 配置 / 数据层 | 存储配置或结构化数据 | JSON 格式 |
.wxml | 结构层 | 定义页面布局和组件结构 | HTML |
.wxss | 样式层 | 控制页面样式和视觉表现 | CSS |
这些文件类型共同构成了微信小程序的开发框架，分别负责逻辑、数据、结构和样式，分工明确且协同工作。
一个变量 需要现在js内定义 js内可以定义变量，和函数实现
使用变量时需要先定义
在js下
1定义
2赋值
3动态绑定后显示
使用{{}}可以动态绑定
以下是部分简单功能代码展示
获取用户授权码
授权码只能用一次 每次授权码都是不同的
发送请求功能
这里data就是返回的整体数据
后端得开启服务才能使用此功能
