欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  科技

uniapp 自定义原生tabbar样式

程序员文章站 2022-03-21 18:49:01
全网上大多数方法就是写一个自定义样式的tabbar然后封装成组件最后再自己现实跳转功能但是这样做无论是性能或体验来说都是很差的最近好像uview挺火的,他们也写了一个tabbar组件。然后引用一下他对自己写的tabbar评价确实自定义tabbar会出现这些问题。缺点:1、需要在每一个需要tabbar页面引用这个组件,再设定好相应的激活值 2、跳转的时候屏幕上会出现短暂的空白,网络不好的时候还会很严重 3、如果......

全网上大多数方法就是写一个自定义样式的tabbar 然后封装成组件 最后再自己现实跳转功能

但是这样做无论是性能或体验来说都是很差的 

最近好像uview挺火的,他们也写了一个tabbar组件。然后引用一下他对自己写的tabbar评价

 

  uniapp 自定义原生tabbar样式

 

uniapp 自定义原生tabbar样式

 

确实自定义tabbar会出现这些问题。

缺点:1、需要在每一个需要tabbar页面引用这个组件,再设定好相应的激活值

           2、跳转的时候屏幕上会出现短暂的空白,网络不好的时候还会很严重

           3、如果没有记错,滚动条好像也不会保存,切换回去会回到顶部

 

优点:样式好看。

 

那可不可以兼容两者的优点,规避掉那些致命的缺点呢。

 

当然可以。

我们可以直接修改uniapp的源码,就可以达到目的

他tabbar的源码我都删了,然后自己写。我修改了h5端的源码,其他端也一样。

从样式到js重做。还增加了一些属性,甚至还给图标加了阴影自定义属性。

完美~

uniapp 自定义原生tabbar样式

 

 

 

 

本文地址:https://blog.csdn.net/hiose89/article/details/107859607

相关标签: 前端 uniapp