微信小程序两种跳转页面的方法

步骤一：添加新页面

在这里插入图片描述
在小程序目录下的pages文件下新建文件下，命名为news

在这里插入图片描述
在app.json中添加新的页面"pages/news/news"

在这里插入图片描述
此时news文件夹下出现四个配置文件。

方法一：navigator
在这里插入图片描述
在小程序首页，即index.wxml中
添加<navigator url="../news/news">跳转至新页面</navigator>

在这里插入图片描述
效果如上图所示，点击此文本段则跳转至新页面。

方法二:button

在这里插入图片描述

在小程序首页，即index.wxml中，添加 <button bindtap="aaa" size="mini" type="primary">跳转至新页面</button>，其中aaa为新定义的函数，size控制按钮大小。

在这里插入图片描述
在index.js中定义函数，跳转至新页面。

 aaa(){
  wx.navigateTo({
    url: '../news/news',
  })
  },

在这里插入图片描述
效果如图，点击按钮则跳转至新页面。