004-vue文件介绍

.vue文件介绍

<template>

<!-- 编写html内容的 -->

</template>

<script>

//编写js内容的

import { defineCompoment } from 'vue' //使用es6结构语法传入vue中的定义组件方法, 方法名为defineCompoment

export default defineCompoment({ //方法传入一个对象, 这个对象实际上就是我们的配置对象

name: 'Home', //组件名称

//接受父组件的数据

props: {

},

//定义子组件

components: {

},

//(*)setup函数

//props: 接受父组件传过来的参数 ctx: 上下文... 注意: 在setup中没有this

setup(props, ctx){

return{

}

}

})

</script>

<style scoped lang="scss">

//编写样式文件

//scoped: 表示样式只在改文件生效

//lang="scss" 表示使用Sass解释器

</style>