vue路由跳转后页面el-table样式失效

今天在写一个系统主页面跳转到后台管理列表页面后再次跳转回主页面，主页面所有的el-table样式失效，刷新后样式回复正常。且多次操作等会发生这样的问题。
后来是发现后台管理列表页面组件中<style>中添加了全局样式，没有加scoped

<styel scoped>...<style>

添加之后就不会有这样的问题了

scoped可以实现组件的私有化，不对全局样式造成污染

原理：

• 给HTML的DOM节点加一个不重复data属性(形如：data-v-2311c06a)来表示他的唯一性
• 在每句css选择器的末尾（编译后的生成的css语句）加一个当前组件的data属性选择器（如[data-v-2311c06a]）来私有化样式

当前端的style只属于当前组件，不受其他组件干预！

<style scoped>
	.el-table::before {//去掉最下面的那一条线
            height: 0px;
    }
</style>

使用 scoped 后，父组件的样式将不会渗透到子组件中。

el-table的样式会在scope下失效，这个时候就用到了深度选择器

使用深度作用选择器 /deep/ 或者’>>>’ ,但注意像sass、less预处理器不认三个箭头

<style scoped>
	/deep/ .el-table::before {//去掉最下面的那一条线
            height: 0px;
    }
</style>

css作用域