在项目开发中我遇到这样的一个问题，页面需要navigator链接跳转一个页面，tabbar也需要导航到这个页面，最开始还没有添加tabbar的时候，navigator都能够正常跳转，但是当加上tabbar的时候，tabbar能跳转，navigator就点击不动了。

一脸蒙逼的我开始以为是逻辑处理上出了问题，排查了半天也没发现哪儿有问题，控制台也不报错，心累。。。

后来又开始查navigator、tabbar的属性，怀疑是有什么属性问题，通过观察发现navigator有个open-type属性，值为switchTab，果不其然，将他加上，就没问题了

&Tip:项目中navigator、tabbar有指定导航到同一个页面的话，在navigator标签里加上open-type="switchTab"，就能解决navigator点击不动的情况

小程序tabbar和navigator一起使用点不动的更多相关文章

  1. 微信小程序~tabBar和navigator一起使用无效

    1.当注册了tabBar的时候,使用navigator时会发现不能跳转,这个时候需要在navigator上加上open-type=’switchTab’ 属性 <navigator open-t ...

  2. 微信小程序 tabBar模板

    tabBar导航栏 小程序tabBar,我们可以通过app.json进行配置,可以放置于顶部或者底部,用于不同功能页面的切换,挺好的... 但,,,貌似不能让动态修改tabBar(需求:通过switc ...

  3. 微信小程序tabbar设置样式在哪里改

    微信小程序tabbar通俗点说就是底部导航,我们一般会配置相关的菜单,方便读者快速导航.tabbar是在项目根目录中的配置文件 app.json 中进行设置:如果小程序是一个多 tab 应用(客户端窗 ...

  4. 小程序tabBar显示问题

    我一直在纠结为什么小程序在有的页面显示,有的页面不显示 查了一下才知道,小程序tabBar只在tabBar中的list定义了页面的才会显示,其余页面不会显示 如下例:tabBar只在画红框的页面显示

  5. 微信小程序tabBar与redirectTo 或navigateTo冲突

    微信小程序tabBar与redirectTo 或navigateTo冲突 tabBar设置的pagePath无法再次被redirectTo或navigateTo引用 导致跳转失败,更改为swithTa ...

  6. 小程序开发-组件navigator导航篇

    navigator 页面链接 navigator的open-type属性 可选值 navigate.redirect.switchTab,对应于wx.navigateTo.wx.redirectTo. ...

  7. 小程序 TabBar 定制

    使用微信小程序开发时,用到了其 API - tabBar,设置如下(详细的内容可以参考官网 api): "tabBar": { "color": "# ...

  8. 微信小程序 - tabbar动态更换图标以及文字

    大家不喜欢小程序的tabbar原因之一就是它太死板,tabbar一旦在app.json定义以后文字不能改,图标不能改! 我要自制tabbar!!! 其实在微信更新完1.9.0基础调试以后就推出了更新方 ...

  9. 小程序页面链接-navigator（导航）

    navigator-页面链接-通过设置open-type的值来确定页面的打开方式. <view class="btn-area"> <navigator url= ...

随机推荐

  1. C语言中typedef用法

    C语言中typedef用法 1. 基本解释 typedef为C语言的关键字,作用是为一种数据类型定义一个新名字.这里的数据类型包括内部数据类型(int,char等)和自定义的数据类型(struct等) ...

  2. 【MySQL 原理分析】之 Trace 分析 order by 的索引原理

    一.背景 昨天早上,交流群有一位同学提出了一个问题.看下图: 我不是大佬,而且当时我自己的想法也只是猜测,所以并没有回复那位同学,只是接下来自己做了一个测试验证一下. 他只简单了说了一句话,就是同样的 ...

  3. Centos 下设置静态ip地址

       今天小编遇到了需要设置centos(6.4) 下静态ip地址,下面把详细步骤记录下来. 1> 首先打开这个 vi /etc/sysconfig/network-scripts/ifcfg- ...

  4. javascript Math对象 常用数字操作方法

    var t='1.2'; parseInt(t) parseFloat(t)//1.2 Number(1.2)//1.2强制转换为数字 2.向上取整,有小数就整数部分加1 js: Math.ceil( ...

  5. 虚拟机ubuntu的网络连接类型

    图很好 https://jingyan.baidu.com/article/91f5db1b17e8a01c7f05e3e6.html 很详细,有实例 https://www.cnblogs.com/ ...

  6. php 安装扩展插件实例-ftp.so

    工作记录一下   1.首先进入原始php包安装文件(不是安装后的文件,是下载php安装压缩包,解压后的那个文件)安装包里有个扩展文件夹ext,进入 #cd /home/php-5.3.3/ext/#l ...

  7. window下建立vue.js项目

    安装node.js 直接下载安装文件安装就可以了 vue项目搭建 .到自己要件项目的文件夹运行cmd命令 .如果没有安装vue-cli .npm install -g vue-cli .vue ini ...

  8. TCP协议可靠性是如何保证之滑动窗口，超时重发，序列号确认应答信号

    原创文章首发于公众号:「码农富哥」,欢迎收藏和关注,如转载请注明出处! TCP 是一种提供可靠性交付的协议. 也就是说,通过 TCP 连接传输的数据,无差错.不丢失.不重复.并且按序到达. 但是在网络 ...

  9. Webpack之(progressive web application) - PWA中的 Service Workers 是什么

    学习文档:https://webpack.docschina.org/guides/progressive-web-application/ 参考文档:https://developers.googl ...

  10. C语言四

    c语言循环结构 为什么用循环? C语言中的循环主要分为三种:while循环,do...while循环 for循环 while循环:先判断条件是否成立,如果条件成立将执行其下的循环体,如果条件不成立一次 ...