微信开发者工具创建一个小程序

创建项目

对于上面这个AppID可以自行选择是注册还是测试号，我是使用的测试号，之后再下面选择模板，我这里选择了JS-基础模板。

进入项目后在模拟器中可看到如下页面：

添加提交按钮进行页面跳转

添加需要跳转的文件夹，并在其中添加js、json、wxml、wxss文件：
找到app.json文件：
在app.json文件中找到pages配置，加入新增的文件配置："pages/user/user"，该属性注册会自动找到user文件夹下的js、json、wxml、wxss文件(如果根据显示的选择，应该选择wxml，不然编译会找不到user.wxml)：
此时会编译会报错，user.json为空，只要在该文件中加入{}即可，当然也可以加入{"usingComponents": {}}，其中usingComponents表示的是使用的组件，这样写组件是空的相当于{}：
找到登录页面index.wxml编写"登录按钮"：<button type="primary" bind:tap="onSubmit">登录</button>
找到index.js开始编写onSubmit方法进行跳转，以下开始编写onSubmit及user文件夹中的内容；

javascript 复制代码

  // 登陆操作
  // 使用wx.navigateTo({})
  onSubmit() {
    wx.navigateTo({
      url: '/pages/detail/user',
    })
  }
  onSubmit() {
      wx.navigateTo({
        url: '/pages/user/user',
        success: function(res) {
          console.log("跳转成功")
        },
        fail: function(res) {
          console.log("跳转失败")
        }
      })
    }
    // 或者使用wx.redirectTo({})
    onSubmit() {
      wx.redirectTo({
        url: '/pages/user/user',
        success: function(res) {
          console.log("跳转成功")
        },
        fail: function(res) {
          console.log("跳转失败")
        }
      })
    }

【补充】其中实现跳转的方法还有：使用导航组件、标签、页面链接实现，将上述提到的index.wxml中<button type="primary" bind:tap="onSubmit">登录</button>改为<navigator url="../user/user">登录</navigator>即可，这样就不需要再index.js中新增方法了。

html 复制代码

<!-- user.wxml -->
<scroll-view class="scrollarea" scroll-y type="list">
  <view class="container">
  user page
  </view>
</scroll-view>

【注意】在user.js中一定至少要有：Page({})，不然实现跳转也是空的页面，不会显示user.wxml文件中的信息！！！

微信开发者工具开发文档：https://developers.weixin.qq.com/doc/。