如何使用Vuescoped和deep-创新互联
这篇文章主要为大家展示了如何使用Vue scoped和deep,内容简而易懂,希望大家可以学习一下,学习完之后肯定会有收获的,下面让小编带大家一起来看看吧。
创新互联建站自2013年起,是专业互联网技术服务公司,拥有项目成都网站建设、做网站网站策划,项目实施与项目整合能力。我们以让每一个梦想脱颖而出为使命,1280元利州做网站,已为上家服务,为利州各地企业和个人服务,联系电话:18980820575众所周知,在组件中给style 标签添加属性 scoped 属性可以避免组件内样式对外界造成污染,scoped使得组件内的样式变成局域样式,只作用于当前组件。
原理如下-------
在编译组件的时候,如果当前组件内style标签上有scoped属性,那么会在当前所有标签上添加一个【data-v-hash】属性,而当前样式表内的所有末尾选择器后面也会加上该属性,那么就使得当前组件内的样式只会作用于当前组件内的元素。值得注意的是,当父组件,子组件同时使用scoped属性时,子组件最外层的标签既会被加上当前组件的hash值,又会加上父级组件的hash值,像这样
//子组件最外层标签
但是有个问题------
在我们用scoped的时候回发现一个问题,就是我们在当前组件内使用的scoped,但是我想在当前组件内改变子组件的样式(非最外层标签),的时候会发现不好使。
标题名称:如何使用Vuescoped和deep-创新互联
网站URL:http://ybzwz.com/article/hcedj.html