微信小程序–实现按钮跳转另一个页面

首先建立一个按钮

index.wxml页面中建立一个容器作为按钮

<view class='day-weather' bindtap='onTapDayWeather'>
</view>

上面是我代码部分,由bindtap构建一个按钮函数

然后在index.js页面写onTapDayWeather函数

onTapDayWeather(){
    wx.showToast()
  }

然后编译点击按钮,出现如图所示,这样一个则是按钮设置成功

这里写图片描述

创建一个新页面

  1. 在pages下面新建一个目录list,然后list新建page命名list
    这里写图片描述
  2. list.js里面的生命周期函数全删除
    这里写图片描述
  3. list.wxml里面写点内容标记一下,<text>Hello World!</text>
    这里写图片描述

写跳转函数

回到index.js页面,修改之前的按钮函数

onTapDayWeather(){
    wx.navigateTo({
      url: '/pages/list/list',
    })
  }

然后编译,点击按钮

这里写图片描述
跳转成功

嗯,有些地方是部分代码,不懂的可以问我


图片中的水印是我自己csdn博客的水印,直接复制过来的,不是盗的博文。有兴趣可以去去看看。

相关文章

发表回复

您的电子邮箱地址不会被公开。 必填项已用*标注