::v-deep的使用（CSS深度作用选择器）的实际应用

使用 deep scoped 可以实现对样式应用的修改，不必选择全局样式污染样式

1、常规使用

        在 vue 项目的开发过程，使用了 ElementUI 组件且样式 style 使用了 scoped 属性，当想要修改组件样式，发现直接修改不了，需去掉 scoped 属性或者使用深度选择器才能修改成功。去掉scoped的话又会影响全局样式，针对这种情况，可以使用深度作用选择器（即样式穿透）

2、在v-html中使用深度选择器对其中的样式进行设定

// html


// script
data() {
	return {
		content: `

		
传统的组件之间的共享数据方式
		

			
父向子传值： v-bind
			
子向父传值：v-on
			
兄弟组件之间共享数据：EvenBus
			
$on 接受数据的那个组件
			
$on 接受数据的那个组件
			
$emit 发送数据的那个组件
		
	
`,
	};
},

// css

3、在字符串模板中编写的CSS样式可以使用深度选择器进行设定

// script
divStr = `

    
${item.name}
    

        
 日处理量${item.dealNum} 吨        
        
        
 污水处理率${item.dealRate}%
    
    
`;

// css