微信小程序中创建小程序页面的步骤介绍（图文）（怎么做小程序页面）

微信小程序中创建小程序页面的步骤介绍（图文）（怎么做小程序页面）

本篇文章给大家带来的内容是关于微信小程序之创建小程序页面的步骤介绍，有一定的参考价值，有需要的朋友可以参考一下，希望对你有所帮助。

创建一个简单的页面，创建小程序页面的具体几个步骤：

1. 在pages 中添加一个目录

程序员必备接口测试调试工具：立即使用Apipost = Postman + Swagger + Mock + Jmeter Api设计、调试、文档、自动化测试工具 后端、前端、测试，同时在线协作，内容实时同步

或者这样添加

2. 新建一个wxml 文件

在test文件夹底下新建一个wxml空文件

3. 编辑test.wxml 文件

为了方便测试 我们随便 填写点内容进去

这是我的test页面哦哦！！！ -

4. 同样的方法，创建test.js文件，编辑test.js文件

在test文件夹底下新建一个js空文件使用上述同样的方法在test 目录下创建一个 test.js 文件，为了方便测试 我们随便 填写点内容进去(也可以不填，直接空文件也可)

//test.js //获取应用实例 var app = getApp() Page({ data: { userInfo: {} }, onLoad: function () { console.log('onLoad test'); } })-

5. 将test 页面加入 app.json

打开全局文件 app.json，在文件里面添加 "pages/test/test"（加入一条 test 页面所在的目录 ）

6. 在首页加入跳转访问链接

一切准备就绪，该添加的都已经添加，下面就是见证奇迹的时刻，在首页写一个页面入口 ，跳转到我们要测试的页面上，直接在首页 pages/index/index.wxml 添加一段代码一句链接

跳转test页面 -

7. 测试

8：设置页面标题

设置页面标题 ，是非常简单的一个步骤哦，找到所在页面的目录，新建一个 json 文件（一般都是自动生成的，如果没有就新建一个），比如我们上一次建造的 test 页面， 找到 pages/test/ 目录 新建一个 test.json 文件 加入如下代码。

{ "navigationBarTitleText": "详情页"}-

效果如下：

OK，到此，创建页面和实现页面间的跳转完成

版权声明：本文内容由网络用户投稿，版权归原作者所有，本站不拥有其著作权，亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容，请联系我们jiasou666@gmail.com 处理，核实后本网站将在24小时内删除侵权内容。