.vue是什么文件

作者：醉眼看苍生发布日期:2026-03-29 浏览:33

<template>
  <div>
    <h1>这是一个 Vue 组件</h1>
    <p>{{ message }}</p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      message: 'Hello, Vue!'
    };
  }
};
</script>

<style scoped>
h1 {
  color: #42b983;
}
</style>

解释说明：

.vue 文件是 Vue.js 单文件组件 (SFC, Single File Component) 的文件格式。
每个 .vue 文件包含三个部分：<template>、<script> 和 <style>。
- <template> 定义了组件的 HTML 结构。
- <script> 包含组件的 JavaScript 逻辑，如数据、方法等。
- <style> 用于定义组件的样式，scoped 属性确保样式只应用于当前组件。

上一篇：element vue

下一篇：vue3 h函数