uniapp 开发小程序时修改组件样式，失效的解决方法

uniapp 修改组件默认样式一般使用v-deep等方法，如下：

::v-deep .uni-select {
  height: 25px;
}
css
40 Bytes
© It知识记录分享
::v-deep .uni-select {
	height: 25px;
}

但是有时会发现这样不起作用，特别是组件的“view” 的层级很多的时候 ，那么就需要使用“小程序样式穿透”的功能，添加后，上面的样式就可以使用了，方法如下：

<script>
  export default {
    // 微信小程序中 options 选项  
    options: {
      styleIsolation: 'shared'
    },
  }
</script>
javascript
122 Bytes
© It知识记录分享
<script>
	export default {
		// 微信小程序中 options 选项  
		options: {
			styleIsolation: 'shared'
		},

	}
</script>

如果在uniapp中使用的是VUE3的setup语法糖，那就要把上面的代码单独写，如下：

<script setup>
//你的代码
</script
//下面是单独的穿透代码 
<script>
  export default {
    // 微信小程序中 options 选项  
    options: {
      styleIsolation: 'shared'
    },
  }
</script>
php
168 Bytes
© It知识记录分享
<script setup>
//你的代码
</script

//下面是单独的穿透代码 
<script>
	export default {
		// 微信小程序中 options 选项  
		options: {
			styleIsolation: 'shared'
		},

	}
</script>