美文网首页
vue周期函数

vue周期函数

作者: GaoXiaoGao | 来源:发表于2020-09-11 10:21 被阅读0次

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(){} //销毁完成

相关文章

  • Vue学习笔记(12)-生命周期函数

    生命周期函数 生命周期函数代表的是Vue实例,或者是Vue组件,在网页中各个生命阶段所执行的函数。生命周期函数可以...

  • 😄--前端面试整理--VueJs

    1、Vue的指令都有哪些? 2、Vue的生命周期函数 3、除了生命周期函数还有哪些钩子函数 4、Vue组件是怎么进...

  • vue的生命周期

    了解vue的生命周期函数和运行中事件,有助于我们更好地使用vue 四个周期函数: beforeCreate :第一...

  • vue生命周期

    学习vue的生命周期 什么是生命周期函数? vue的生命周期函数(又称为钩子函数)是一个vue实例从开始创建,到初...

  • vue基础知识精讲

    一、Vue实例生命周期函数 生命周期函数是vue实例在某一个时间点会自动执行的函数。 测试一下: 二、Vue的模板...

  • Vue生命周期函数调用的时间

    vue的生命周期函数有11个,常用的8个生命周期函数必须要掌握

  • 了解vue.js的生命周期函数

    了解vue的生命周期函数和运行中事件,有助于我们更好地使用vue 具体代码文件 四个生命周期函数 beforeCr...

  • Vue进阶

    Vue实例 Vue实例生命周期函数 Vue模板语法 Vue计算属性、方法、侦听器 Vue计算属性的setter和g...

  • vue.js 生命周期

    Vue实例 生命周期函数流程 —— beforeCreate、created、beforeMount、mounte...

  • Vuejs开发环境搭建

    其他文章Vuejs的生命周期函数vue-router配置vue模板语法vue计算属性和侦听器vue Class与S...

网友评论

      本文标题:vue周期函数

      本文链接:https://www.haomeiwen.com/subject/bmrvektx.html