慕课网-微信小程序入门与实战-常用组件API开发技巧项目实战-第7章开始制作电影资讯页面-给项目加入tab选项卡

给项目加入tab选项卡

1.进入目录 pages,在目录 pages 下创建目录 movies

2.进入目录 pages/movies,新建文件 movies.js、movies.wxml、movies.json、moives.wxss

3.进入目录 pages/movies,修改文件 movies.js

Page({

})

5.进入目录 pages/movies,修改文件 movies.json,添加 {}

{}

6.修改项目下文件 app.json

{
  "pages": [
    "pages/welcome/welcome",
    "pages/posts/posts",
    "pages/posts/post-detail/post-detail",
    "pages/movies/movies"
  ],
  "requiredBackgroundModes": [
    "audio",
    "location"
  ],
  "window": {
    "navigationBarBackgroundColor": "#405f80"
  },
  "tabBar": {
    "list": [
      {
        "pagePath": "pages/movies/movies",
        "text": "电影"
      },
      {
        "pagePath": "pages/posts/posts",
        "text": "文章"
      }
    ]
  },
  "sitemapLocation": "sitemap91.json"
}

7.进入目录 pages/welcome,修改文件 welcome.js,链接方式必须改成 wx.switchTab

Page({
  onTap:function() {
    // wx.navigateTo({
    //   url:'../posts/posts'
    // });

    //wx.redirectTo({
    // url: '../posts/posts',
    //})

    wx.switchTab({
      url: '../posts/posts',
    })
  },
}) 

8.测试

 

 

 

posted on 2019-11-27 10:35  herisson_pan  阅读(6)  评论(0)    收藏  举报

导航