小程序 Tip | 文档、环境、开发工具界面与特性
时间:2022-07-22
本文章向大家介绍小程序 Tip | 文档、环境、开发工具界面与特性,主要内容包括其使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。
文档与环境相关
- 微信开发文档
- 小程序平台
- 开放平台的 设置-- 帐号信息中 可以获取微信小程序AppID
新建项目
- 主要文件 app.js 脚本文件 app.json 配置文件 app.wxss 样式表文件 微信小程序会读取这些文件,并生成小程序实例;
开发工具界面面板
- Console面板
显示错误信息;
输出信息的调试代码:
console.log('onLoad')
Console面板中 输入Js代码 也可以 立即执行; - Sources面板 用于显示当前项目的脚本文件, 左侧是源文件目录, 中间显示的是选中文件的源代码, 右侧显示的是调试相关按钮及变量的值等信息:
- 微信小程序框架 会对 脚本文件 进行编译的工作, 所以在 Sources面板中开发者看到的文件 是经过处理之后的 脚本文件, 开发者的代码 被包裹在 define函数中;
- NetWork面板 用于观察和显示网路请求request和socket的情况; 通过这个面板可以调试网络请求(如请求格式、响应数据的格式、请求状态、用时等信息);
单击某一个请求的item,可以看到请求的详细信息:
- AppData面板 用于显示当前项目中的具体数据,实时反馈项目数据情况;
可以在AppData面板中编辑数据, 编辑后数据会及时反馈到界面上:
- Storage面板
用于显示当前项目使用本地存储的情况,
在小程序中可以用
wx.setStorage
或者wx.setStorageSync
将数据保存到手机本地存储中; 如创建的初始项目中, logs页面会将操作日志写到本地存储的logs变量中:
- Wxml面板 用于帮助开发者查看Wxml转化后的界面。 可以看到 真实的页面结构 以及 结构对应的wxss属性; 同时可以修改wxss属性,在模拟器中实时看到修改的情况;
通过调试模块左上角的选择器, 还可以快速找到页面中组件对应的wxml代码:
代码编辑
- 方便快捷的文件管理
- 微信小程序主要有js、json、wxml和wxss这4中格式的文件,
开发工具提供了
针对
这4种格式文件的编辑器; - 对于js文件,有完备的代码补全、提示功能:
- 编辑器快捷键
参考自《从零开始学微信小程序开发》
- 如何使用R连接Hive与Impala
- Equation Group泄露工具之vBulletin无文件后门分析
- 如何使用CDSW在CDH集群通过sparklyr提交R的Spark作业
- 如何使用Beeline连接Impala
- 微软公式编辑器系列漏洞分析(一):CVE-2017-11882
- 预警揭秘:倒计时炸弹11.2.0.4前版本DB Link必须在2019年4月升级真相
- RPO攻击技术浅析
- 渗透技巧 | Windows上传并执行恶意代码的N种姿势
- 如何通过Cloudera Manager配置Spark1和Spark2的运行环境
- 从CPU漏洞Meltdown&Spectre看侧信道攻击
- 如何使用Java连接Kerberos的Kafka
- 隐藏在Chrome插件商店中的恶魔——恶意插件User-Agent Swither分析
- 如何使用CDSW在CDH中分布式运行所有R代码
- 如何在CDH中使用HBase快照
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- Day11.类和对象这回事儿
- Day12.魔法方法&方法重写
- Linux基础第一课——基础知识了解
- 【Vue CLI】手把手教你撸插件
- Linux基础第二课——系统架构
- Day13.继承&多态
- Linux第三课——目录操作
- Linux基础第四课——文件操作
- Linux基础第五课——用户管理
- Linux基础第六课——grep|awk|sort|uniq
- Python向上取整,向下取整以及四舍五入函数
- 使用requests模块post payload请求
- 解决HTTP status code is not handled or not allowed
- Day8.函数那些事儿
- mac下更改Jupyter notebook工作目录