Vue provides a special file format to combine the template, logic, and styling of a component in a single file. This format is called Single-File Component (SFC) also known as *.vue file.
Component.vue
1
<scriptsetup>
2
import { ref } from'vue'
3
constcount = ref(0)
4
</script>
5
6
<template>
7
<pclass="greeting">{{ count }}</p>
8
</template>
9
10
<stylescoped>
11
.counter {
12
color: orangered;
13
}
14
</style>
This format is very convenient for small components, but it can become a bit overwhelming for larger components. In this case, you can split your SFC into multiple files using the scr attribute to import an external file for a language block:
Component.vue
1
<scriptsrc="./script.js"></script>
2
3
<templatesrc="./template.html"></template>
4
5
<stylescopedsrc="./styles.css"></style>
This approach doesn't work with the <script setup> block. Compiler macros like defineProps or defineEmits are compiler macros only usable inside <script setup>.
But you can import any JavaScript/Typescript file:
nima
回复删除0元获取订阅，仅支持Clash，节点多，节点在线率高，订阅地址请点击我头像获取！https://www.against-ddos.eu.org/ClashConfig/index.yml
回复删除