南飓风 发表于 2025-4-11 15:25:45

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

一、小程序创建新的页面

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的绿色按钮,点击以后就可以看到调试的信息。

免责声明:如果侵犯了您的权益,请联系站长,我们会及时删除侵权内容,谢谢合作!更多信息从访问主页:qidao123.com:ToB企服之家,中国第一个企服评测及商务社交产业平台。
页: [1]
查看完整版本: 微信小程序创建新的页面和调试小程序