微信小程序教程系列之新建页面(4)


Posted in Javascript onApril 17, 2017

例如在web的开发中,新建一个页面只需要新建一个html文件即可。

但是到在微信小程序中,新建一个页面也不只是新建一个wxml文件,那么该如何做呢?下面我们一起来学习

新建一个页面的步骤:

1> 必须要创建一个wxml文件和一个js文件,并且文件名要同名(例:test.wxml 和 test.js)。
2> js文件内,需要写上注册页面的Page()函数!
3> 并且要到app.json文件中,注册新建页面的路径信息。

示例:

新建了一个test.js文件和一个test.wxml文件,
以及在app.json文件内的”pages”数组内,放在第一个的页面,就是程序启动时,第一个所打开的页面。

微信小程序教程系列之新建页面(4)

在test.js文件中,必须要有一个Page()函数

微信小程序教程系列之新建页面(4)

在wxml文件内,随便写一点内容(否则打开空白页,你都不知道是否成功运行项目)

微信小程序教程系列之新建页面(4)

F5运行项目:

微信小程序教程系列之新建页面(4)

成功新建了一个页面

备注:

记得要新建js文件,并且要注册Page()函数,否则就会报如下错误

微信小程序教程系列之新建页面(4)

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jquery遍历input取得input的name
Apr 27 Javascript
TBCompressor js代码压缩
Jan 05 Javascript
JavaScript高级程序设计 DOM学习笔记
Sep 10 Javascript
js自动生成对象的属性示例代码
Oct 28 Javascript
JS中FRAME的操作问题实例分析
Oct 21 Javascript
使用JavaScript为Kindeditor自定义按钮增加Audio标签
Mar 18 Javascript
Three.js学习之几何形状
Aug 01 Javascript
easyui-edatagrid.js实现回车键结束编辑功能的实例
Apr 12 Javascript
jQuery树插件zTree使用方法详解
May 02 jQuery
微信小程序实现bindtap等事件传参
Apr 08 Javascript
JavaScript怎样在删除前添加确认弹出框?
May 27 Javascript
优雅的使用javascript递归画一棵结构树示例代码
Sep 22 Javascript
微信小程序商城项目之淘宝分类入口(2)
Apr 17 #Javascript
微信小程序商城项目之购物数量加减(3)
Apr 17 #Javascript
微信小程序商城项目之商品属性分类(4)
Apr 17 #Javascript
微信小程序商城项目之侧栏分类效果(1)
Apr 17 #Javascript
Map.vue基于百度地图组件重构笔记分享
Apr 17 #Javascript
JS简单验证上传文件类型的方法
Apr 17 #Javascript
JavaScript实现的商品抢购倒计时功能示例
Apr 17 #Javascript
You might like
Zerg剧情介绍
2020/03/14 星际争霸
PHP的一个完美GIF等比缩放类,附带去除缩放黑背景
2014/04/01 PHP
php性能分析之php-fpm慢执行日志slow log用法浅析
2016/10/17 PHP
PHP如何将图片文件上传到另外一台服务器上
2019/08/26 PHP
javascript中的缓动效果实现程序
2012/12/29 Javascript
js中的caller和callee属性介绍和例子
2014/06/07 Javascript
javascript实现下雪效果【实例代码】
2016/05/03 Javascript
jQuery实现指定区域外单击关闭指定层的方法【经典】
2016/06/22 Javascript
谈谈第三方App接入微信登录 解读
2016/12/27 Javascript
字太多用...代替的方法(两种)
2017/03/15 Javascript
Angular2学习教程之组件中的DOM操作详解
2017/05/28 Javascript
Vue2.0父组件与子组件之间的事件发射与接收实例代码
2017/09/19 Javascript
react实现菜单权限控制的方法
2017/12/11 Javascript
layui 解决富文本框form表单提交为空的问题
2019/10/26 Javascript
js面向对象方式实现拖拽效果
2021/03/03 Javascript
一步步教你用Python实现2048小游戏
2017/01/19 Python
Python之Web框架Django项目搭建全过程
2017/05/02 Python
Python 3实战爬虫之爬取京东图书的图片详解
2017/10/09 Python
Python实现获取nginx服务器ip及流量统计信息功能示例
2018/05/18 Python
Python实现对文件进行单词划分并去重排序操作示例
2018/07/10 Python
python pygame实现方向键控制小球
2019/05/17 Python
python制作简单五子棋游戏
2019/06/18 Python
python根据多个文件名批量查找文件
2019/08/13 Python
pyinstaller打包程序exe踩过的坑
2019/11/19 Python
解决pycharm同一目录下无法import其他文件
2020/02/12 Python
python opencv实现简易画图板
2020/08/27 Python
你可能不熟练的十个前端HTML5经典面试题
2018/07/03 HTML / CSS
详解如何用HTML5 Canvas API控制图片的缩放变换
2016/03/22 HTML / CSS
五分钟学会HTML5的WebSocket协议
2019/11/22 HTML / CSS
SQL面试题
2013/04/30 面试题
java程序员面试交流
2012/11/29 面试题
学院领导推荐信
2013/10/30 职场文书
教师批评与自我批评发言稿
2014/10/15 职场文书
初二学生评语大全
2014/12/26 职场文书
2015教师年度思想工作总结
2015/04/30 职场文书
redis连接被拒绝的解决方案
2021/04/12 Redis