1. 程式人生 > >微信小程式連線無法跳轉提示can not navigate to tabBar page錯誤

微信小程式連線無法跳轉提示can not navigate to tabBar page錯誤

若是在全域性app.json中配置了tabBar。那麼在開發中呼叫wx.navigateTo介面時候,若是跳轉的url與tabBar中list頁面中引用同樣的
頁面路徑,那麼結果會是無法跳轉。【開發版本:0.12.130400】
上面的是官方的解釋,下面是我的程式碼報錯,這個是app.json; 裡面的配置項,"pagePath": "pages/logs/logs",
{
  "pages":[
    "pages/index/index",
    "pages/logs/logs"
  ],
  "window":{
    "backgroundTextStyle":"light",
    "navigationBarBackgroundColor": "#fff",
    "navigationBarTitleText": "WeChat",
    "navigationBarTextStyle":"black"
  },
  "tabBar": {
    "list": [{
      "pagePath": "pages/index/index",
      "text": "首頁"
    }, {
      "pagePath": "pages/logs/logs",
      "text": "詳情"
    }]
  }
}
這個是我介面的index.js
Page({
  data:{
    // text:"這是一個頁面"
  },
  onLoad:function(options){
    // 頁面初始化 options為頁面跳轉所帶來的引數
    console.log(options);
  },
  onReady:function(){
    // 頁面渲染完成
     console.log("---index page onReady---");
  },
  onShow:function(){
    // 頁面顯示
     console.log("---index page onShow---");
  },
  onHide:function(){
    // 頁面隱藏
     console.log("---index page onHide---");
  },
  onUnload:function(){
    // 頁面關閉
     console.log("---index page onUnload---");
  },  
  itemClick : function (){
    wx.navigateTo({
      url:"../logs/logs?id=1",
      success: function (res) {
        console.log(res.data+"1")
      },
      fail: function (err) {
        console.log(err)
      }
    })
    console.log(1111);
  }
})


app.js和itemClick函式跳轉介面衝突了,官方的要求是:

如果在這種情況下無法實現跳轉並出現can not navigate to tabBar page錯誤很有可能是由於在底部tabbar裡面定義樂同樣連線地址的bar,如果在底部footer頁面定義了相同地址的bar,則此頁面無法跳轉,

最好是當tabbar定義了相同的跳轉地址在頁面中不要再定義相同的連結了

最後再推薦個部落格給大家閱讀學習: http://blog.csdn.net/xiansky2015/article/details/54908130

相關推薦

程式連線無法提示can not navigate to tabBar page錯誤

若是在全域性app.json中配置了tabBar。那麼在開發中呼叫wx.navigateTo介面時候,若是跳轉的url與tabBar中list頁面中引用同樣的頁面路徑,那麼結果會是無法跳轉。【開發版本:0.12.130400】 上面的是官方的解釋,下面是我的程式碼報錯,這個

程式--navigator url 失效

在編輯微信小程式的時候,遇到的坑,使用 <navigator url='/pages/logs/logs'>跳轉</navigator>進行跳轉失效 了,進行多次測試發現,當頁面中的跳轉路徑與app.json中配置的tabBar 相重複時,頁面中的跳轉會失效,不

程式--簡單頁面

微信小程式--簡單頁面跳轉 例如:點選一個text ,跳轉入一個新的頁面blueberry.wxml 首先對text 設定監聽事件  <view bindtap="toast" cla

mpvue程式之間的navigator標籤的坑 ,接收不到extra-data傳遞的物件

老方法即將廢棄,在這裡就不多說了,在mpvue裡這個方法其實是有坑的 navigator標籤官方文件,詳細介紹去這裡看 A小程式 <navigator target="miniProgram" open-type="navigate" app-i

程式例項:到頂部例項

      總所周知,小程式不能操作dom,那麼我們要怎麼實現在頁面滾動到一定條件的時候,顯示gotop圖示,點選後跳轉到頁面的頂部呢?       這裡小程式有個元件是可以實現的,那就是scroll-view元件,他具有很多的屬性,其中我們要利用到以下兩個屬性來處理: s

程式新頁面

在json配置路徑,會自動生成對應的css\js\json(例如:test.wxss\test.js\test.json) 頁面跳轉兩種方法 一種通過js,一種通過頁面 第一種:在要點選跳轉的標籤上加事件,3步, 如:1、要在點選文字上跳轉 <view

程式之頁面、傳參

年前最後一天上班了,公司幾個人在上班,沒事做,還是來學習一下小程式吧。 本部落格說一下頁面跳轉,頁面跳轉又分為三種:跳轉新頁面,當前頁面跳轉及tab跳轉。 先來看看navigator相關屬性: 直接程式碼說話: 主頁面: <!--index

關於程式的動態頁面

最近在研究微信小程式。在做一個簡單的購物小程式時,遇到一個問題:如何通過掃碼實現動態的跳轉頁面功能, 通過研究終於找到了解決方法: 首先當然要實現掃碼解析功能js的程式碼: 1 2 3 4 5 6 7 8 9 10 11 12 13

程式--實現按鈕另一個頁面

首先建立一個按鈕 在 index.wxml頁面中建立一個容器作為按鈕 <view class='day-weather' bindtap='onTapDayWeather'> </

程式實現頁面傳值以及獲取值的方法分析

本文例項講述了微信小程式實現頁面跳轉傳值以及獲取值的方法。分享給大家供大家參考,具體如下:在安卓中頁面跳轉傳值都是通過bundle,現在研究一下小程式的列表跳轉及頁面傳值。my.wxml<view class="container"> <view bind

程式帶引數遊戲

小遊戲的預設路徑是 pages/index/index wx.navigateToMiniProgram({ appId: 'wxef98a1fd370dd5ac', path:'pages/index/index?channcelCod

程式的頁面和引數傳遞,頁面生命週期

頁面的生命週期函式如下: Page({   data:{        },   onLoad:function(options){     // 生命週期函式--監聽頁面載入     console.log("---index page onLoad---")   },

程式-navigator頁面

純方便自己看 2種跳轉方法: 一:(函式) 模組中有點選事件,bindtap或者catchtap這種,在本頁面的js裡設定函式 XXXXX: function () { wx.navigateTo({ url: "../logs/logs",

程式(5)--頁面傳值(點選item傳值)

one頁面實現以下程式碼: 1,data-id="{{item.id}}"為標記列表的下標, item.id的來源與wx:for="{{ components }}"的列表渲染 bindtap="re

解決程式使用switchTab後頁面不重新整理的問題

wx.switchTab({ url: '../index/index', success: function (e) { var page = get

程式程式之間的和傳參示例程式碼附講解

 可以掃碼加我微信,承接小程式開發。 微信小程式開發交流qq群   173683895  、 526474645 ; 正文: 一:微信小程式跳轉 使用限制 需要使用者觸發跳轉 從 2.3.0 版本開始,若使用者未點選小程式頁面任意位置,則開發者將無法呼叫此介面自動

程式中頁面時如何傳遞一個物件

必須在需要跳轉的頁面中先使用 JSON.stringify(obj)對需要傳遞的物件資料進行轉換(轉換為json格式的資料), 把轉換後的資料 接在 url後面。最後在跳轉顯示的頁面先使用JSON.parse(json) 轉換為js型別的資料。 例: 在跳轉需要跳轉的頁面 i

程序--簡單頁面

nav on() ott url tex bsp function toa toast 首先對text 設置監聽事件 <view bindtap="toast" class="usermotto"> <text class="user-mott

程序之頁面

spa 今天 style color log code body 微信 navigate 如今 微信小程序已經充滿的我們的生活,那麽今天我就來說一說微信小程序中的最基礎的 頁面跳轉 1. wx.navigateTo(保留當前頁面,跳轉到應用內的某個頁面,使用wx.nav

解決程式防止無法回到主頁的問題

【小程式】提交訂單頁面到訂單詳情頁面,如何防止無法回到主頁 問題場景: 小程式某個頁面完成後,希望跳轉到另一個相關頁面。 比如,訂單提交完成後,希望跳轉到訂單詳情頁面,可選的方案有兩個 前端精品教程:百度網盤下載 A 使用 wx.navigateTo 跳轉到非 tabBar 頁面 優點是