自学内容网 自学内容网

微信小程序创建新的页面和调试小程序

一、小程序创建新的页面

1、一般创建方式

1、在微信开发者工具里,找到项目的pages文件夹,右击选择新建文件夹,比如list。

2、选中list文件夹,右击选择新建page,输入list,回车,这个时候list对应的四个文件就生成了。

2、快速创建方式

打开app.json文件,在pages对应的结构体中添加需要创建的页面路径,比如"pages/cart/cart",然后保存,这个时候在pages目录下就自动生成对应的页面文件了。

二、小程序调试基础库

1、含义

小程序调试基础库是指微信开发者工具中可以选择微信基础库的版本。微信基础库是指小程序运行的环境,给小程序提供了运行所需的API和工具,以及基础框架和运行逻辑等。

每个小程序都有自己所允许使用的基础库最低版本要求,开发者需要选择兼容的基础库版本,从而确保小程序的功能正常运行。

2、如何选择调试基础库的版本

点击微信开发者工具右上角的详情按钮,选择本地设置,在调试基础库一栏选择基础库的版本。

三、调试小程序

在微信开发者工具中,点击调试器按钮,在开发者工具底部会显示调试器页面。

1、Wxml选项卡

Wxml选项卡页面显示的是模拟器的页面布局,通过鼠标选择相应的代码,在模拟器上会有相应的提示,起到调试样式和布局的作用。

2、console选项卡

在console选项卡页面显示的是ts中打印出来的信息,包括system打印的信息和我们小程序打印的信息。如果觉得系统信息较多,影响我们调试,可以右击hide相应的信息,相当于添加了一个filter条件。

3、Network选项卡

这个页面显示的是小程序向服务器发送的网络请求,开发者可以查看到详细的信息

4、AppData选项卡和Storage选项卡

AppData选项卡可以查看小程序页面定义了哪些数据。

Storage选项卡可以查看小程序在本地存储了哪些数据。

5、编译按钮

点击编译按钮会重新编译代码,并且会刷新页面。

6、预览按钮

点击预览按钮,会弹出一个弹框,点击继续预览小程序,这个时候会弹出一个二维码,使用微信扫一扫,扫描这个二维码,就会打开小程序的页面。点击右上角的三个点,在底部的弹框中,选择最右边的开发调试,然后打开调试,这个时候小程序会自动退出,再次打开小程序,会看到页面有一个vConsole的绿色按钮,点击以后就可以看到调试的信息。


原文地址:https://blog.csdn.net/ddddwwww2/article/details/143798629

免责声明:本站文章内容转载自网络资源,如本站内容侵犯了原著者的合法权益,可联系本站删除。更多内容请关注自学内容网(zxcms.com)!