微信小程序开发入门 笔记一 2024/11/29

笔记:               微信小程序入门  

新建项目

1. .json 后缀的 JSON 配置文件
2. .wxml 后缀的 WXML 模板文件
3. .wxss 后缀的 WXSS 样式文件
4. .js 后缀的 JS 脚本逻辑文件

小程序中，JSON扮演的静态配置的角色。

 app.json 小程序的全局配置包含 页面路径 页面表现 网络超时时间 底部tab等配置

pages字段用于描述页面路径

Window字段用于设置顶部背景颜色文字颜色等

entryPagePath 用于设置默认启动页

tabBar 用于设置底部菜单栏

networkTimeout 用于设置网络超时时间

debug 用于打开和关闭debug调试功能  默认关

functionalPages 用于打开和关闭 支持插件功能 默认关

其他功能点击直达

 project.config.json工具配置 简单的说就是编辑器设置自动保存文件,换电脑也可以恢复个人操作习惯设置  和小程序项目基本无关

 pages/logs /logs.json

page.json 和logs.json 一样功能是 分块定义页面颜色.

JSON语法 键值对  {"键":值,"键":值}

常见错误" 双引" 写成 '单引 '

值的定义标准(不能添加注释):

数字:浮点数和整数

字符串: "双引号之中"

Bool:布尔值 true false

数组:包括在[方括号中 ]

对象:包括在{大括号中}

Null

 WXML 模板文件:这个就类似于HTML

不同的是标签比方说html是 div wxml 中为 view

组件参考传送门点击直达

 核心思想:渲染和逻辑分离

数据绑定

逻辑管理 :

渲染主页:

  数据绑定、列表渲染、条件渲染、模板、引用 等传送门直达

WXSS样式,类似css    rpx 单位可以自动换算屏幕尺寸 但是 为浮点数 

全局样式定义 app.wxss      简单理解父框

单独样式定义 页面名.wxss 简单理解子框

wxss参考资料传送门

JS逻辑处理

一个简单的按钮按下 改变文字

1.添加一个按钮

 2.编写逻辑事件更改数据

效果演示  点击前

 效果演示  点击后

更多相关api参考资料点击直达