SFC 是 single file component 的缩写,直译过来就是单文件组件。

$$tip

通常开发中单文件组件文件的后缀为 .vue

$$

<template>
    <!-- 页面模板 -->
    <h1 class="title" @click="hit">{{ title }}</h1>
</template>

<script>
export default {
    data() {
        // 数据
        return {
            title: "三眼鸭的编程教程",
        }
    },
    methods: {
        // 定义函数的地方
        hit() {
            alert("hit")
        },
    },
}
</script>

<style scoped>
/* 样式 */
.title {
    color: teal;
}
</style>