在 Vue3 的开发过程中，很多开发者会遇到样式穿透相关的需求，而“deep”在其中就扮演着很重要的角色，接下来将以问答的形式，详细为大家讲解在 Vue3 中如何正确使用 deep。
什么是 deep 以及为什么在 Vue3 中需要它？
1 问：deep 是什么？
答：在 Vue 组件化开发中，每个组件都有自己独立的作用域，其样式默认不会影响到子组件，这是为了保证组件样式的封装性和独立性，而“deep”（在某些场景下也写作“::v-deep”）是一种特殊的 CSS 选择器语法，它用于打破这种样式封装,使父组件的样式能够影响到子组件内部的元素。
2 问：为什么在 Vue3 中会需要用到 deep 呢？
答：尽管组件的样式隔离有助于构建大型应用时避免样式冲突，但在实际开发中，我们常常会遇到一些情况，比如使用第三方 UI 库，这些库的组件样式可能需要根据我们的项目风格进行调整，由于其组件内部样式的封装，常规的 CSS 选择器无法直接作用于这些子组件内的元素，这时候，“deep”就派上用场了，它可以帮助我们突破这种样式隔离,对第三方组件或子组件内部样式进行定制。