vue的生命周期

创建前 beforeCreate

创建   create

挂载前 beforeMount

挂载 mounted

更新前 beforeUpdate

更新 updated

销毁前 beforeDestroyed

销毁  destoryed

methods --方法

-----------------------------------华丽的分割线-------------------------

一个React组件的生命周期分为三个部分:挂载期(Mounting)、存在更新期(Updating)和销毁时(Unmounting)。

import React,{ Component } from 'react';

class Demo extends Component {
constructor(props,context) {
super(props,context)
this.state = {
//定义state
}
}
componentWillMount () { //组件将要挂载
}
componentDidMount () { //组件渲染完成 这里调用ajax请求,返回数据setstate组件会重新渲染
}
componentWillReceiveProps (nextProps) {
}
shouldComponentUpdate (nextProps,nextState) {
}
componentWillUpdate (nextProps,nextState) {
}
componentDidUpdate (prevProps,prevState) {
}
render () {
return (
<div></div>
)
}
componentWillUnmount () {
}
}
export default Demo;

在componentDidMount方法中放ajax请求--服务器会根据变量渲染,Constructor中设置变量初始化

如果你觉得我的文章对您有帮助,给点鼓励,谢谢

Vue与React的异同 -生命周期的更多相关文章

  1. react学习小结(生命周期- 实例化时期 - 存在期- 销毁时期)

    react学习小结   本文是我学习react的阶段性小结,如果看官你是react资深玩家,那么还请就此打住移步他处,如果你想给一些建议和指导,那么还请轻拍~ 目前团队内对react的使用非常普遍,之 ...

  2. vue 和 react 学习 异同点

    vue 和 react 学习 异同点 本文不做两个框架比较,只对比了两个框架的语法对比,不代表任何观点,盗版必究,本人唯一qq:421217189 欢迎大家一起来学习探讨,壮我大前端(本文markdo ...

  3. React组件和生命周期简介

        React 简介----React 是 Facebook 出品的一套颠覆式的前端开发类库.为什么说它是颠覆式的呢? 内存维护虚拟 DOM 对于传统的 DOM 维护,我们的步骤可能是:1.初始化 ...

  4. 2. React组件的生命周期

    2. React组件的生命周期 使用React开发时候用到最多的就是React的组件了,通过继承React.Component,加入constructor构造函数,实现Render方法即可.这当中Re ...

  5. Vue 实例详解与生命周期

    Vue 实例详解与生命周期 Vue 的实例是 Vue 框架的入口,其实也就是前端的 ViewModel,它包含了页面中的业务逻辑处理.数据模型等,当然它也有自己的一系列的生命周期的事件钩子,辅助我们进 ...

  6. React 组件的生命周期方法

    React 组件的生命周期方法 按渲染顺序: 1: componentWillMount() – 在渲染之前执行,在客户端和服务器端都会执行. 2: componentDidMount() – 仅在第 ...

  7. Vue – 基础学习(1):对生命周期和钩子函的理解

    一.简介 先贴一下官网对生命周期/钩子函数的说明(先贴为敬):所有的生命周期钩子自动绑定 this 上下文到实例中,因此你可以访问数据,对属性和方法进行运算.这意味着你不能使用箭头函数来定义一个生命周 ...

  8. react第三单元(react组件的生命周期)

    第三单元(react组件的生命周期) #课程目标 灵活掌握react组件的生命周期以及组件的活动过程. 能够灵活使用react的生命周期 #知识点 react的类组件的生命周期分为三个阶段 实例期 存 ...

  9. React 之 组件生命周期

    React 之 组件生命周期 理解1) 组件对象从创建到死亡它会经历特定的生命周期阶段2) React组件对象包含一系列的勾子函数(生命周期回调函数), 在生命周期特定时刻回调3) 我们在定义组件时, ...

随机推荐

  1. C++MFC编程笔记day03 MFC工具栏、状态栏、视图窗体

    MFC工具栏 相关类: CToolBarCtrl - 父类是 CWnd  封装了工具栏控件相关操作 CToolBar - 父类是CControlBar  封装了工具栏和框架窗体之间的关系 工具栏使用: ...

  2. 哈希key个数

    $length = keys %hashname; 则$length中得到的直接是该hash的key的个数.

  3. [机器学习实战] 决策树ID3算法

    1. 决策树特点: 1)优点:计算复杂度不高,输出结果易于理解,对中间值的缺失不敏感,可以处理不相关特征数据. 2)缺点:可能会产生过度匹配问题. 3)适用数据类型:数值型和标称型. 2. 一般流程: ...

  4. java文档 第十一章 其他考量-b

    Finalization 和弱引用.软引用.虚引用 Finalization and Weak, Soft, and Phantom References Some applications inte ...

  5. C语言之指针基础概念

    今天就写一下关于C语言指针的一些感想吧. 很多同学都搞不懂指针,我一开始也云里雾里没看懂指针,而且老师又把指针说得很难的样子.其实主要是把指针”*“的作用给弄混了,不用畏惧,细心点看就可以了. 首先简 ...

  6. 跨浏览器的CORS

    function createCORSRequest(method, url){ var xhr = new XMLHttpRequest(); if("withCredentials&qu ...

  7. FIFO、LRU、OPT页面调度算法及样例

    网上非常多介绍3种页面置换算法的样例和过程是不对的, 本文依据<操作系统概念>第七版对三种算法做介绍,并给出正确的样例以验证算法. 一.FIFO先进先出页面置换算法,创建一个FIFO队列来 ...

  8. Chisel Tutorial(六)——port

    下面内容根据2015-7-10版的Chisel 2.2 Tutorial整理 port就是硬件单元对外的接口,须要指明方向(输入还是输出).一个port声明的样例例如以下: class Decoupl ...

  9. centos终端显示-bash-4.2#解决方法

    登录linux系统过后,发现显示的是-bash-4.2# 而不是root@主机名 + 路径的显示方式,发生这种情况的原因是根目录下缺失几个配置文件,从默认配置中拷贝过来就可以解决了: cp /etc/ ...

  10. unity, remove a scene from build settings

    把scene添加到build settings的scenes in build列表里以后,如果想删除,没有菜单可用,但选中按delete即可. 参考:http://answers.unity3d.co ...