tab点击切换不使用判断条件进行不同tab的切换刷新

这篇具有很好参考价值的文章主要介绍了tab点击切换不使用判断条件进行不同tab的切换刷新。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

注:我这里使用的antd vue ui文章来源地址https://www.toymoban.com/news/detail-708260.html

<a-card :bordered="false">
  <a-tabs v-model="current" @change="callback" style="width: 15%">
    <a-tab-pane key="receivable" tab="应收账单">
	<!-- 这里写组件 组件的ref要和tab的key一致-->
	</a-tab-pane>
    <a-tab-pane key="meet" tab="应付账单" force-render> </a-tab-pane>
  </a-tabs>
</a-card>
data() {
    return {
      current: 'receivable',
      },
     },
methods: {
    callback(key) {
      this.current = key
      this.$nextTick(() => {
      	// 这里就是触发相应的组件响应事件。
        // this.$refs[`${this.current}`].load()
      })
    },
  }

到了这里,关于tab点击切换不使用判断条件进行不同tab的切换刷新的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • vue项目关于iframe嵌套的页面,在切换tab标签时会被重新刷新的问题处理方案

    这两天工作中遇到一个这样的需求,切换tab标签时,要求对应的tab页面不刷新,但是项目中加入了一部分含有iframe的页面,在切换路由的过程中,如果使用keep-alive是达不到缓存ifram嵌套的页面效果的。 vue中的keep-alive 1.原理:vue 的缓存机制并 不是直接存储 DOM 结构 ,而是将

    2024年02月04日
    浏览(80)
  • 解决element ui中el-tabs标签点击切换闪屏问题

    现象:点击切换 element ui中el-tabs时候,table会出现闪一下的状况; 初始element ui中el-tabs组件代码如下: 使用v-if=\\\"activeName===\\\'first\\\'\\\" 解决闪屏   改造后代码如下:

    2024年02月07日
    浏览(48)
  • C# .NET SQL sugar中 IsAny进行根据条件判断数据是否存在 IsAny的使用

    首先确保你的Service层继承的表名 控制器中使用IsAny进行根据条件判断数据是否存在

    2024年01月20日
    浏览(55)
  • vue3中如何实现通过点击不同的按钮切换不同的页面

    完成以上需求,我们可以使用vue中的component标签来实现。 component是Vue.js中一个特殊的标签,用于动态地绑定其它组件。它可以与v-bind:is指令一起使用,来决定要渲染哪个组件。下面是示例代码

    2024年02月09日
    浏览(54)
  • 【vue+Swiper】vue中使用swiper缩略图,展示一张大图及n张小图,点击小图切换不同的大图展示,完整代码

    效果: 这是在swiper官网上找的示例,swiper太强大了,有非常多不同的示例,有api,有教程,还可以下载示例代码。 但是第一次使用,研究这个缩略图的实现还是花了几个小时,好在实现了。 swiper官网请戳这里 安装 将swiper封装成组件可以复用,在components公共组件文件夹中新增

    2024年02月05日
    浏览(46)
  • vue3如何实现点击不同的菜单页切换局部页面

    我们可以使用router来实现 去饿了么(element-plus)找到自己喜欢的页面然后按需导入,以下以自己的例子来实现 首先引入布局容器 然后引入菜单栏 引入这两个,先看效果 此时基本的页面准备好了 容器是有这个属性的,但默认值为false 并把菜单栏里对应的文字改为router-link 在

    2024年02月16日
    浏览(65)
  • unity——通过点击按钮进行场景切换

    前记 通过 点击鼠标 进行场景切换请参考: Unity——通过点击鼠标进行场景切换_行秋的博客-CSDN博客 通过点击按钮进行场景切换请参考:unity——通过点击按钮进行场景切换_行秋的博客-CSDN博客1.准备两个示例场景 2.点击File—Build Settings...,将场景添加到视图中,点击Build。选

    2024年01月25日
    浏览(60)
  • Unity——通过点击鼠标进行场景切换

    前记 通过 点击按钮 进行场景切换请参考: unity——通过点击按钮进行场景切换_行秋的博客-CSDN博客 1.准备两个示例场景 2.点击File—Build Settings...,将场景添加到视图中,点击Build。选择文件夹进行保存。(建议将文件打包到空的文件夹)3.为场景添加Button(UI)在Hierarchy视图中

    2023年04月23日
    浏览(46)
  • 解决swiper在Element-ui的tabs标签页切换时,swiper不生效,以及v-if和v-show不生效,还有左右箭头切换按钮点击无效的情况。

    解决swiper在Element-ui的tabs标签页切换时,swiper不生效,以及v-if和v-show不生效,还有左右箭头切换按钮点击无效的情况。 官网给出的解决方案是,使用observer:swiper4的api地址: https://www.swiper.com.cn/api/observer/218.html. 在切换Element-ui的tabs标签的时候,切换到没有使用Swiper的页面时销

    2024年02月15日
    浏览(61)
  • 使用JS来实现tab栏切换

    这是我今天从学习的知识点,今天试着做了一个tab栏切换,学到很多的知识点,讲师也比学校的老师讲的更加详细明白 个人名片:  😊作者简介:一名大一在校生,web前端开发专业  🤡 个人主页:几何小超  🐼座右铭:懒惰受到的惩罚不仅仅是自己的失败,还有别人的成

    2024年02月07日
    浏览(34)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包