Skip to content

Commit f3bee13

Browse files
docs: ✏️ 常见问题添加Vue 3.3+使用defineOptions设置styleIsolation规则的介绍
Closes: #784
1 parent 1fd0a27 commit f3bee13

1 file changed

Lines changed: 8 additions & 11 deletions

File tree

docs/guide/common-problems.md

Lines changed: 8 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -58,14 +58,18 @@ pnpm add sass@1.78.0 -D
5858
<wd-button type="primary">主要按钮</wd-button>
5959
```
6060

61+
`Vue 3.2` 及以下版本可以使用如下配置开启`styleIsolation: 'shared'`选项:
6162
```ts
63+
// vue
6264
<script lang="ts">
6365
export default {
6466
options: {
6567
styleIsolation: 'shared'
6668
}
6769
}
6870
</script>
71+
<script lang="ts" setup>
72+
</script>
6973
```
7074

7175
```scss
@@ -74,21 +78,14 @@ export default {
7478
color: red !important;
7579
}
7680
```
77-
78-
什么?还有人想问:这样写还我怎么使用`script setup`啊!
79-
80-
**_简单,这样写两个就行了_**
81-
81+
`Vue 3.3+` 可以通过`defineOptions`开启`styleIsolation: 'shared'`选项:
8282
```ts
83-
<script lang="ts">
84-
export default {
83+
<script lang="ts" setup>
84+
defineOptions({
8585
options: {
8686
styleIsolation: 'shared'
8787
}
88-
}
89-
</script>
90-
91-
<script lang="ts" setup>
88+
})
9289
</script>
9390
```
9491

0 commit comments

Comments
 (0)