vue1.0写tab插件

Vue3自定义tab-窗格标题内容1。打开一个vue文件，添加一个el tabs组件，设置第一个tab默认选中，1.呈现页面时，默认情况下会显示第一页，2.当切换tab时，将加载该页面的数据，tab点击标签事件:tab被选中时触发。他的返回值是选择的tagtabinstancetaband事件，打印出来显示如下:tab有一个索引值，可以作为tab切换的索引；tab有标签，也可以当开关用。

通常情况下，我们不接触vue底层的东西，或者突发奇想，需要自己创建一套框架。回过头来看，我们其实用插件最多。插件，也可以理解为一套方法。当我们需要调用它时，只需介绍它。比如比如swiper和elementui。一般来说，我们会在每个项目中安装很多插件。用来处理各种交互效果和逻辑，但是在网上找到的插件不一定能解决我们所有的问题。

这些东西网上没有插件，需要自己写。在这一点上，如果在每个组件中定义方法，那么它就太低了。我们需要自己写一个插件这样会事半功倍！一般来说，我们自己的js通常是用以下两种形式编写的:第一，声明多个方法。这种方法也称为函数声明。这种方法的优点是，只要你引用它，就可以在页面的任何地方使用。但是同样的缺点也很明显，容易造成全局污染，浪费浏览器资源。

有三个可切换的tabs选项卡。红框中的tabs页签请求的是同一个接口，但两个页签传递的参数值不同，橙色框请求的是另一个接口。点击不同页签，跳转到页面，请求不同接口返回的数据。默认显示最新知识页签的数据。Html页面:最新知识和热门知识转移到同一个界面，排行榜就是一个界面。接口:最新知识和热门知识的接口向后端传递参数(直接传递汉字):最新知识或热门知识。

1。打开一个vue文件，添加一个el tabs组件，设置第一个默认选中。2.添加新标签el tabpane，使用slotlabel将内容自定义为小图标 标题。3.保存vue文件后，用浏览器打开它。此时，您可以看到第一个标题显示为日期图标加标题效果。

tab页面请求，如果切换进来，就会请求这个页面的数据。如果页面一加载就请求所有数据，会造成数据拥塞，对性能影响很大。因此，当tabs选项卡页面点击切换时，您应该使用tabclick事件发起相应的网络请求。1.呈现页面时，默认情况下会显示第一页。2.当切换tab时，将加载该页面的数据。tab点击标签事件:tab被选中时触发。他的返回值是选择的tagtabinstancetaband事件。打印出来显示如下:tab有一个索引值，可以作为tab切换的索引；tab有标签，也可以当开关用。

可以看文档，这里是描述页的链接。因为html不区分大小写，所以请采用。因为浏览器不区分大小写，所以在浏览器环境中开发时，只能正确识别带杠的小写。在webpack环境中，可以识别大驼峰和杠的使用。现在普遍使用vuecli，它是在webpack环境下开发的，所以你可以写任何你喜欢的东西，并保持一致的风格。

插件通常用于给Vue添加全局函数。所谓全局函数，在使用之前不需要引入一次，就像一个组件一样，对于插件，只要在开头引入一次，就可以直接在任何组件中使用。(类似于我们在窗口上添加的method属性，可以在任何地方使用，)以下常见用法如下:主要有两种使用方式:全局介绍(1)通过全局方法Vue.use () 插件使用步骤。