标签：vue name label BreadcrumbItem tag 面包屑
一、面包屑导航（breadCrumb）
标签（tag）
1.在main.js中引用tag
2.在页面或组件中使用tag
3.Tag的属性
4.Tag的事件有两个，点击和关闭
总结
面包屑导航(breadcrumb)
面包屑导航显示当前页面的路径，同时支持跳回之前任意页面
breadcrumb的使用：
按需引入的需要引入两个模块:Breadcrumb、BreadcrumbItem,在main.js中
// main.js
import {Breadcrumb, BreadcrumbItem} from 'element-ui';
// 面包屑导航,注入到全局
vue.use(Breadcrumbhttp://www.cppcns.com)
Vue.use(BreadcrumbItem)
在页面中使用
breadcrumb很简单，直接定义即时，跳转功能通过为BreadcrumbItem组件添加to属性即可。如下例子：
{{item.label}}
<;/el-breadcrumb>
export default {
name:'ComHeader',
data:function(){
return {
tabList:[
{
name:'index',
// 这里的路径必须是vue-router里定义的路由
path:'/',
label:'首页'
},{
name:'user',
// 这里的路径必须是vue-router里定义的路由
path:'/user',
www.cppcns.com label:'用户管理'
},{
name:'mall',
// 这里的路径必须是vue-router里定义的路由
path:'/mall',
label:'商品管理'
}
]
}
}
标签：vue,name,label,BreadcrumbItem,tag,面包屑 来源： https://www.cnblogs.com/zmh114712318/p/16463669.html
本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享； 2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关； 3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关； 4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除； 5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。