<template>
<div></div>
</template>
<script>
export default {
name: '',
components: {},
props: {},
data () {
return {
};
},
computed: {},
watch: {},
created() {},
mounted() {},
methods: {},
beforeDestroy() {},
destroyed() {},
}; // 添加分号,修复报错 Missing semicolon.eslint
</script>
<style scoped>
</style>
或者如下,生命周期都放在methods之后:
<template>
<div></div>
</template>
<script>
export default {
name: '',
components: {},
props: {},
data () {
return {
};
},
methods: {},
computed: {},
watch: {},
created() {},
mounted() {},
beforeDestroy() {},
destroyed() {},
};
</script>
<style scoped>
</style>
template:组件的模板部分,定义了组件的结构和布局;
script:组件的逻辑部分,包括组件的数据、计算属性、生命周期钩子函数、方法等。
- name:组件的名称,用于调试和递归组件中使用。
- components:引入和注册子组件。
- props:组件的属性,接收父组件传递的数据。
- data:组件的数据。
- computed:计算属性,根据数据计算衍生出来的属性。
- watch:监听数据的变化并做出相应的响应。
- methods:组件的方法。
- created:组件实例被创建之后调用。
- mounted:组件挂载到DOM后调用。
- beforeDestroy:组件销毁之前调用。
- destroyed:组件销毁后调用。
style:组件的样式部分,定义组件的样式。