微信小程序教程系列之新建页面(4)
例如在web的开发中,新建一个页面只需要新建一个html文件即可。
但是到在微信小程序中,新建一个页面也不只是新建一个wxml文件,那么该如何做呢?下面我们一起来学习
新建一个页面的步骤:
1> 必须要创建一个wxml文件和一个js文件,并且文件名要同名(例:test.wxml 和 test.js)。
2> js文件内,需要写上注册页面的Page()函数!
3> 并且要到app.json文件中,注册新建页面的路径信息。
示例:
新建了一个test.js文件和一个test.wxml文件,
以及在app.json文件内的”pages”数组内,放在第一个的页面,就是程序启动时,第一个所打开的页面。
在test.js文件中,必须要有一个Page()函数
在wxml文件内,随便写一点内容(否则打开空白页,你都不知道是否成功运行项目)
F5运行项目:
成功新建了一个页面
备注:
记得要新建js文件,并且要注册Page()函数,否则就会报如下错误
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们。
相关推荐
-
微信小程序登录态控制深入分析
微信小程序登录态控制深入分析 最近微信小程序终于开放了个人注册,我当然不能浪费这个炫技的好机会,"菲麦日程"小程序正在全力推进中,尽请期待~~ 在登录态控制中,摸索尝试了小一阵子,特此分享 一.微信建议的登录态控制 说明: 1)小程序内通过wx.login接口获得code 2)将code传入后台,后台对微信服务器发起一个https请求换取openid.session_key 3)后台生成一个自身的3rd_session(以此为key值保持openid和session_key),返回给前
-
微信小程序开发(一) 微信登录流程详解
最近在研究微信小程序开发,非常有意思的一个东西.花了一点时间写了一个微信的登录流程,包括后端接口和小程序代码. 做过微信登录的都知道,我们需要一个标识来记录用户的身份的唯一性,在微信中unionId就是我们所需要的记录唯一ID,那么如何拿到unionId就成了关键,我将项目分为小程序和 后台PHP代码两部分来讲. 微信小程序开放平台 先从我们的小程序代码开始 简单的说一下我们小程序的js代码登录流程 login ->获取code ->getUserInfo获取iv和encryptedData
-
微信小程序搭建及解决登录失败问题
等了好久的小程序,终于在近日曝光了.现在就带大家来尝尝鲜.以下是一张随便看看的图. 一.构建微信小程序的步骤 下载开发工具 考虑到微信0.9.092100的Web开发者工具对于登录做了限制,所以下载登录还是需要一点门路的,我在下面有介绍,希望大家耐心的往下面看~下载工具的地址:链接 密码: r3hc. 破解的步骤就是:将破解压缩包的两个文件,放到如下图路径: 这个是MAC路径: 应用程序->微信web开发者工具->显示包内容 /Resources/app.nw/app/dist/compone
-
微信小程序实战之登录页面制作(5)
提供一个登录页的案例,供同学们使用 项目效果图: 目录结构: 图片资源: name.png key.png loginLog.jpg login.wxml: <view class="container"> <view class="login-icon"> <image class="login-img" src="../images/loginLog.jpg"></image>
-
微信小程序实战之顶部导航栏(选项卡)(1)
本文实例为大家分享了微信小程序顶部导航栏的具体代码,供大家参考,具体内容如下 需求:顶部导航栏 效果图: wxml: <!--导航条--> <view class="navbar"> <text wx:for="{{navbar}}" data-idx="{{index}}" class="item {{currentTab==index ? 'active' : ''}}" wx:key=&qu
-
微信小程序 本地存储及登录页面处理实例详解
实例内容 登陆界面 处理登陆表单数据 处理登陆表单数据(异步) 清除本地数据 登录界面: 在app.json中添加登陆页面pages/login/login,并设置为入口. 保存后,自动生成相关文件(挺方便的). 修改视图文件login.wxml <!--pages/login/login.wxml--> <view class="container"> <form bindsubmit="formSubmit"> <vie
-
微信小程序开发一键登录 获取session_key和openid实例
微信小程序开发一键登录 获取session_key和openid实例 思来想去不愿自己的微信小程序是个单机版本.自己又不会写后台.现在借助leancloud可以实现微信小程序一键登录功能.尝试后,做笔记. 第一步:下载av-weapp.js,放到utils下. 第二步:使用 const AV = require('../../utils/av-weapp.js');路径根据具体情况而定. 第三步:做初始化. AV.init({ appId: 'EJx0NSfY********-gzGzoHsz'
-
微信小程序 登录实例详解
微信小程序登录 一. 小程序不支持cookie会话 1. 通过传递与检验3rd_session来保持会话 2. 3rd_session可以执行'`head -n 80 /dev/urandom | tr -dc A-Za-z0-9 | head -c 168`该命令生成 3. 使用Redis或者数据库存储session 4. 生成的3rd_session发送给客户端,写入storage 5. 客户端的每次请求必须带上3rd_session 二.加密数据解码 1. $iv,$code是被加密过的数
-
微信小程序 MD5加密登录密码详解及实例代码
微信小程序 MD5加密 在小程序中,页面的脚本逻辑是在JsCore中运行,JsCore是一个没有窗口对象的环境,所以不能在脚本中使用window,也无法在脚本中操作组件.zepto/jquery 也无法使用,因为zepto/jquery 会使用到window对象和document对象.所以在微信小程序中不能使用jquery.md5.js对密码进行加密.下面我提供一种MD5.js加密实例,本实例先静态演示,后面再到小程序中演示. md5.js程序如下: /* * A JavaScript impl
-
微信小程序 后台登录(非微信账号)实例详解
微信小程序 后台登录 实现效果图: 最近写了一个工具类的小程序,按需求要求不要微信提供的微信账号登录,需要调取后台登录接口来登录.由于小程序大部分都是调取微信信息登录,很少有调用自己后台来登录的,所以写的时候各种坑,现在把趟好坑的代码共享给大家吧!(PS:如有不妥之处,共勉之.) 废话不说,直接上代码 找到app.js在里面写如下代码 App({ onLaunch: function () { //调用API从本地缓存中获取数据 var logs = wx.getStorageSync('log
随机推荐
- Python实现网站文件的全备份和差异备份
- 关于JavaScript跨域问题及实时刷新解决方案
- Coldfusion MX技巧精华收集之2第1/6页
- Python记录详细调用堆栈日志的方法
- SQL Server 高性能写入的一些经验总结
- Android通过手势实现答题器翻页效果
- ASP.NET将Session保存到数据库中的方法
- mysql如何根据汉字首字母排序
- php实现利用phpexcel导出数据
- 解决ajax跨域请求数据cookie丢失问题
- Div上下居中
- ie9下alert阻挡jsp渲染ie8下没问题
- Struts2访问Servlet的三种方式
- Java语言中链表和双向链表
- 在SQL Server中使用命令调用SSIS包的具体方法
- dreamweaver 安装Jquery智能提示
- jQuery实现遍历复选框的方法示例
- Win2003下安装PHP5.2.0+MySql5.0.27+PHPMyAdmin2.9.1的配置方法
- 详解Angular2学习笔记之Html属性绑定
- 利用Swift实现一个响应式编程库