首页 > 其他分享 >记录使用uview的tabs组件初始化渲染下划线移位问题解决

记录使用uview的tabs组件初始化渲染下划线移位问题解决

时间:2023-08-03 11:34:21浏览次数:45  
标签:初始化 下划线 渲染 tabs uview current

问题描述:初始化渲染后 tabs的下划线没有居中对其,出现异位。

问题分析:  网上很多大佬分析过出现原因了

记录下解决的过程:  在各个论坛搜集到解决方案都暂时无效  有使用v-if重新渲染的   有给类赋值偏移值的  有强行转换px的 因为各种原因这些方法在自己身上没有奏效所以记录下自己解决方案

偏移问题会在重新点击tabs后计算transform的值而恢复正常。所以在初始化渲染的时候可以把tabs的 current值重新赋值一下

data() {
    return {
      current: 1,
    };
  },
onShow() {
    this.$nextTick(() => {
     // 解决uview u-tab,下划线异常
      this.current = 0;
    });
  },

  

  data() {
    return {
      current: 1,
    };
  },
  onShow() {
    this.$nextTick(() => {
     // 解决uview u-tab,下划线异常
      this.current = 0;
    });
  },
View Code

 

标签:初始化,下划线,渲染,tabs,uview,current
From: https://www.cnblogs.com/leebigfat/p/17602831.html

相关文章

  • 模版层、模型层(modle)、外键字段查询、环境测试搭建、基于下划线查询
    模版之标签模版里面使流程控制:if、else、elseif、for标签:{%tag%}for标签 后端代码deftag(request):user_list=[1,2,3]returnrender(request,'tag.html',locals())前端代码<body>{%foruserinuser_list%}{{user}}{%endfor%}</bo......
  • ant design pro<Tabs>切换时可以重新请求
    参考:https://blog.csdn.net/weixin_43915401/article/details/130953169需求:每次切换tab标签都重新发送请求解决方法:destroyInactiveTabPane属性:whetherdestroyinactiveTabPanewhenchangetab,切换tab时,销毁tabPane<TabsdestroyInactiveTabPane>这个属性,官方文档里没有,需......
  • idea中SpringBoot项目module有红色下划线处理
    问题描述:项目打开时有的module会有红色下划线,点进去文件后又消失不见。项目启动时报错,无法启动。 解决方法:方法1.file->InvalidateCaches然后选择InvalidateandRestart(如果不管用的话可以√上ClearfilesystemcacheandLocalHistory再试一下,李粤说这个hisory挺......
  • 无涯教程-jQuery - Tabs组件函数
    窗口小部件选项卡函数可与JqueryUI中的窗口小部件一起使用。选项卡用于在分成逻辑部分的内容之间交换。Tabs-语法$("#tabs").tabs();Tabs-示例以下是显示Tab用法的简单示例-<!doctypehtml><htmllang="en"><head><metacharset="utf-8"><title>......
  • 让谷歌实现和edge一样的侧边栏效果--标签分组,侧边tab----acid-tabs
    背景知识+插件推荐----acid-tabsChrome/Edge标签组插件对比https://zhuanlan.zhihu.com/p/464427242edge侧边栏截图百度一下,edge侧边栏很容易实现谷歌这方面,据说是到谷歌114版本后,开始支持侧边栏需要一个插件来强化一下https://www.163.com/dy/article/HER3BD74051196HN......
  • vue的router文件里面import路径的时候ts报红色下划线
    Cannotfindmodule'@/views/index/index.vue'oritscorrespondingtypedeclarations.ts(2307)ViewProblem(Alt+F8)Noquickfixesavailable   解决方法在vite-env.d文件中新增declaremodule"*.vue"{  import{DefineComponent}from&......
  • 2023-07-25 uview1.0的u-number-box组件在渲染时会触发change,如何才能避免事件影响?==
    前言:购物车用到加减购物车数量的一个步进器组件,使用的是uview组件1.0版本的u-number-box。该组件设置了一个@change事件,该事件会在页面渲染的时候触发一次,如果你在里面调用了接口,比如增加/减少购物车数量,那么每次一刷新购物车该事件就会被触发,从而导致不必要的报错。解决方案:在......
  • 用python怎么敲出下划线
    用Python怎么敲出下划线在Python中,要敲出下划线可以使用不同的方法,这取决于你想在什么环境下使用下划线。下面将介绍几种常见的情况和对应的解决方案。1.在字符串中敲出下划线如果你想在一个字符串中敲出下划线,可以使用转义字符\来实现。下面是一个示例代码:text="Hello\_Wor......
  • python打印各种文本颜色及加粗、背景色、斜体、下划线
    ----------字体颜色------------print("\033[1;30m字体颜色:白色\033[0m")print("\033[1;31m字体颜色:红色\033[0m")print("\033[1;32m字体颜色:深黄色\033[0m")print("\033[1;33m字体颜色:浅黄色\033[0m")print("\033[1;34m字体颜色:蓝色\033[0m&quo......
  • dede列表每5行加一条虚拟下划线效果
    dede列表每5行加一条虚拟下划线:{dede:listpagesize='12'}<li><ahref="[field:arcurl/]"target="_blank"title="[field:fulltitle/]">[field:title/]</a>[[field:pubdatefunction=MyDate('y-m-d',@me)/]]<......