界面跳转

在微信小程序中，按钮也是<button></button>标签，它是通过bindtap属性来绑定点击事件：

<text class="user-motto" >家庭小账本</text>

</view>

在上文的界面布局中我们可以看到做出的”家庭小账本”图片，就是一个按钮，可以通过以上语句进行定义点击事件，然后通过下面的语句进行跳转定义：

goIndex_1Tap: function (event) {

wx.navigateTo({

url: '../bookkeeping/bookkeeping',

})

url是路径指定，我们可以通过指定路径的方法来进行界面的跳转，但是前提需要我们提前所要跳转到的界面做好，相关工作都做好之后，就可以进行界面跳转了。

界面布局中所提到的：

这个模块是通过导入图片并引入界面跳转来完成变换的，代码如下：

{
"pages": [
"pages/index/index",
"pages/logs/logs",
"pages/bookkeeping/bookkeeping",
"pages/me/me"
],
"window": {
"backgroundTextStyle": "light",
"navigationBarBackgroundColor": "#ce3bc5",
"navigationBarTitleText": "Qi记账本",
"navigationBarTextStyle": "black"
},
"tabBar": {
"list": [
{
"pagePath": "pages/index/index",
"iconPath": "pages/img/shouye2.jpg",
"selectedIconPath": "pages/img/shouye1.jpg",
"text": "首页"
},
{
"pagePath": "pages/me/me",
"iconPath": "pages/img/mine1.jpg",
"selectedIconPath": "pages/img/mine2.jpg",
"text": "我的"
}
]
}
}

通过点击来变换图片，实现界面跳转的效果图，跳转到的界面就是pagePath所指定的界面。

界面跳转还可以利用按钮实现，方法大同小异，

转载于:https://www.cnblogs.com/Qi77/p/10426870.html

微信小程序--家庭记账本开发--05相关推荐

微信小程序家庭记账本开发进度二
第三步是在开发设置李找到你的AppID,然后复制下来第四步是是完成小程序开发者绑定.开发信息配置后,首先下载开发者工具.参考开发文档进行小程序的开发和调试. 前往开发者工具下载页面 ,根据自己的操 ...
微信小程序--家庭记账本开发--01
微信小程序的开发准备与开发工具的学习在这次寒假伊始,临近春节,学习进程有所拉下,现在补上.寻找了好多网站的相关学习视频,包括微信公众平台关于小程序这方面也有好多相关资料供查阅. 1.开发准备: 首先 ...
微信小程序---家庭记账本开发（一）
首先去微信公众平台注册小程序账号并完善相关信息下载微信开发工具并使用测试号新建项目根据网上教程简单了解了开发工具的使用和布局如何对程序进行测试目录结构:具体内容网站上平台上介绍的很详细转载于 ...
微信小程序---家庭记账本开发（四）
在使用标签栏控件是时,遇到了问题: 错误写法: 正确写法: 今天总算把前端做好了,其实真正困难的是在后端,因为之前的基础没有打好,没有办法触类旁通,即使是看着视频讲解,也有很多不会的,但是, ...
微信小程序---家庭记账本开发（三）
今天学到了很神奇的一招:先在app.json页面注册"pages/index_1/index_1",就会自动生成index_1文件夹及相关页面:真是太方便了学习页面跳转设置按钮 ...
微信小程序家庭记账本开发进度七
index.json { "usingComponents": {} } index.wxml  <view class=&qu ...
（微信小程序毕业设计）基于微信小程序便捷记账系统
基于微信小程序便捷记账系统便捷记账系统用户端是基于微信小程序端,后端管理员是基于java编程语言,mysql数据库,idea开发工具,ssm框架开发,本系统分为用户和管理员两个角色,用户微信端可以注 ...
微信小程序家庭理财系统+后台管理系统|前后分离VUE
<微信小程序家庭理财系统+后台管理系统|前后分离VUE>该项目含有源码.论文等资料.配套开发软件.软件安装教程.项目发布教程等本系统包含微信小程序前台和Java做的后台管理系统,该后台采 ...
计算机实战项目、毕业设计、课程设计之 [含论文+辩论PPT+源码等]微信小程序家庭理财系统+后台管理|前后分离VUE[包运行成功
<微信小程序家庭理财系统+后台管理系统|前后分离VUE>该项目含有源码.论文等资料.配套开发软件.软件安装教程.项目发布教程等本系统包含微信小程序前台和Java做的后台管理系统,该后台采 ...

微信小程序--家庭记账本开发--05

界面跳转

微信小程序--家庭记账本开发--05相关推荐

最新文章

热门文章