el-tab设置默认激活的标签页实现步骤
更新时间：2023年09月25日 08:57:09 作者：覆水难收呀
这篇文章主要给大家介绍了关于el-tab设置默认激活的标签页实现步骤,文中通过代码介绍的非常详细,对大家的学习或者工作具有一定的参考借鉴价值,需要的朋友可以参考下
我们先看看官方文档：
步骤一：在每个el-tab-pane中间加个name属性
步骤二：在el-tabs标签里绑定属性v-model="activeTab"，activeTab是随便自己设置的名称。
步骤三：在data数据里面存储你在el-tabs标签里绑定属性v-model所对应的参数名activeTab
此时我设置的 activeTab: 'body',那么此时就是默认激活的标签页是 el-tab-pane标签里面的name="body"的标签页，也就是请求体这个标签页。
下面上传源代码，让大家自己尝试一下哈。
<el-tabs v-model="activeTab" type="border-card" style="min-height: 350px">
<el-tab-pane name="headers" label="请求头(Headers)">
<CodeEdit height="280px" v-model="headers"></CodeEdit>
</el-tab-pane>
<el-tab-pane name="body" label="查询参数(Params)">
<CodeEdit height="280px" v-model="params"></CodeEdit>
</el-tab-pane>
</el-tabs>总结
到此这篇关于el-tab设置默认激活的标签页的文章就介绍到这了,更多相关el-tab设置默认激活标签页内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！
相关文章
这篇文章主要介绍了Vue3+vite路由配置优化(自动化导入),需要的朋友可以参考下2023-09-09
这篇文章主要介绍了vue项目在env文件中设置的变量无效问题及解决方案,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教2024-03-03
这篇文章主要介绍了vue.js中如何导出Excel表格,在项目中经常会遇到这样的需求，今天小编分步骤通过实例代码给大家详细介绍，需要的朋友可以参考下2019-06-06
本文主要介绍了Vue项目部署到jenkins的实现，文中通过示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2022-02-02
这篇文章主要为大家详细介绍了vue+element自定义查询组件，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2021-09-09
vue2+element ui 中的el-table 选中当前行当前行变色的实现代码
这篇文章主要介绍了vue2+element ui 中的el-table 选中当前行当前行变色的实现代码,本文通过实例代码给大家介绍的非常详细,感兴趣的朋友跟随小编一起看看吧2024-07-07
这篇文章主要介绍了vue导出excel文件流中文乱码问题及解决方案，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-06-06
本文主要介绍了根据用户所购买服务的不同，有不同的页面展现。文中通过示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2021-08-08
vue中transition动画使用(移动端页面切换左右滑动效果)
这篇文章主要介绍了vue中transition动画使用(移动端页面切换左右滑动效果),具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教2024-07-07
这篇文章主要介绍了Vue2 响应式系统之分支切换，文章围绕Vue2的相关资料展开主题详细内容，具有一定的参考价值，需要的小伙伴可以参考一下2022-04-04
最新评论