1.vue中的组件
-vue中所有页面由组件组成
-vue可以将公共的部分封装成组件在其他地方使用
-App.vue是根组件,其他组件挂载到App.vue上面(v-rounter路由可以动态挂载组件)
2.封装组件
-创建vue文件,vue文件就是一个组件
-在其他组件中引入组件
-然后挂载组件
-使用组件
例子如下
<template>
<div>
<router-view/>
//3.在组件中使用
<v-home></v-home>
</div>
</template>
<script>
//1.引入组件
import Home from './components/Home.vue'
export default {
name: 'App',
data() {
return{
}
},
//2.挂载组件
components:{
'v-home':Home
}
}
</script>
<style>
</style>
3.生命周期函数
组件挂载,组件更新,组件销毁等触发的周期函数
beforeCreate(){}//实例创建之前
created(){} //实例创建完成
beforeMount(){} //编译之前
mounted(){} //编译完成, 一般可以请求数据,操作dom放在这个方法中
beforeUpdate(){} //更新之前
updated(){} //更新完成
beforeDestroy(){} //销毁之前
destroyed(){} //销毁完成
网友评论