import React from 'react'

class Demo extends React.Component{
constructor(props){
super(props)
this.state={count:1}
this.handleClick=this.handleClick.bind(this)
}
handleClick(){
this.setState({count:this.state.count+1})
}
shouldComponentUpdate(){
if(this.state.count%5==0){ return true
}
return false
}
render(){
return (
<div>
{this.state.count}<br />
<button onClick={this.handleClick}>点击</button>
</div> )
}
}
export default Demo

只有当count等于5时,视图上才会更新数据

react之shouldComponentUpdate简单定制数据更新的更多相关文章

  1. react UI交互 简单实例

    <body><!-- React 真实 DOM 将会插入到这里 --><div id="example"></div> <!- ...

  2. 【Python044--魔法方法:简单定制】

    一.简单定制 基本要求: -- 定制一个计时器的类 -- start和stop代表开始计时和停止计时 -- 假设计时器对象t1,print(t1)和直接调用t1均显示结果 -- 当计时器未启动或停止计 ...

  3. React的一个简单示例

    首发:个人博客,更新&纠错&回复 React的核心是定义组件类,组件有三个要素:状态.行为.界面. 1.渲染状态到界面:状态由组件对象的state属性持有,从状态到界面的渲染工作由组件 ...

  4. React生命周期简单详细理解

    前言 学习React,生命周期很重要,我们了解完生命周期的各个组件,对写高性能组件会有很大的帮助. Ract生命周期 React 生命周期分为三种状态 1. 初始化 2.更新 3.销毁 初始化 1.g ...

  5. 混合开发的大趋势之一React Native之简单的登录界面

    转载请注明出处:王亟亟的大牛之路 这些天都在学习RN这部分吧,然后写了个简单的登陆业务,从"实战"中讲解吧 还是继续安利:https://github.com/ddwhan0123 ...

  6. TypeScript + React + Redux 实战简单天气APP全套完整项目

    下载链接:https://www.yinxiangit.com/171.html 目录: 从面向过程的js到面向对象的js,让web前端更加高大尚.让你的前端步步日上,紧跟技术发展的前沿.让你构建更加 ...

  7. react做的简单的选项卡

    ### 首先安装react的脚手架 cnpm    install   create-react-app   -g    只需要在电脑下载安装一次即可  ###创建项目 create-react-ap ...

  8. react做的简单的购物车

    ###第一步 :首先电脑上已经安装react的脚手架 cnpm  install    create-react-app   -g ###第二步 :创建项目 creact-react-app   项目 ...

  9. react入门及简单配置

    直接script引入的不说了 1.npm i -g create-react-app 2.create-react-app my-app (其中my-app为项目名称) 3.进入项目cd my-app ...

随机推荐

  1. DOM表单(复选框)

    在表单中,尤为重要的一个属性是name <!--复选框的全选.全不选.反选--> <!DOCTYPE> <html> <head lang="en& ...

  2. Microsoft JET Database Engine 错误 '80004005' 未指定错误

    Microsoft JET Database Engine 错误 '80004005'未指定错误 =====解决=======出现这种“未指定错误”时,可以尝试重新注册ASP脚本解释链接库文件在CMD ...

  3. nginx下后端节点realserverweb健康检测模块ngx_http_upstream_check_module

    本文章收录做资料使用,非本人原创,特此说明. 公司前一段对业务线上的nginx做了整理,重点就是对nginx上负载均衡器的后端节点做健康检查.目前,nginx对后端节点健康检查的方式主要有3种,这里列 ...

  4. 包含jdk和nginx的基础镜像

    目的 制作一个基础镜像,包含jdk和nginx,这样要将java项目或一些前端页面做成容器,可以稍作修改引用该镜像. Dockerfile FROM alpine:3.8 ENV \ LANG=C.U ...

  5. sed命令使用介绍(转载)

    sed命令介绍 (转自:http://www.cnblogs.com/ggjucheng/archive/2013/01/13/2856901.html) 简介 sed 是一种在线编辑器,它一次处理一 ...

  6. go 练习

    1.判断 101-200 之间有多少个素数,并输出所有素数 定义:为在大于1的自然数中,除了1和它本身以外不再有其他因数的数称为质数. package main import ( "fmt& ...

  7. HDFS集群PB级数据迁移方案-DistCp生产环境实操篇

    HDFS集群PB级数据迁移方案-DistCp生产环境实操篇 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 用了接近2个星期的时间,终于把公司的需要的大数据组建部署完毕了,当然,在部 ...

  8. 使用sed替换指定文件指定行的指定文本

    下面是将85行的127.0.0.1替换为192.168.10.108 sed -i '85{s/127.0.0.1/192.168.10.108/}' /etc/zabbix/zabbix_agent ...

  9. 添加dubbo.xsd的方法

    整合dubbo-spring的时候,配置文件会报错 因为     阿里关闭在线的域名了.需要本地下载xsd文件  所以,需要下载本地引入. 解决方式: 在dubbo的开源项目上找到xsd文件: htt ...

  10. java中常用的包及作用

    1. java.awt:提供了绘图和图像类,主要用于编写GUI程序,包括按钮.标签等常用组件以及相应的事件类. 2. java.lang:java的语言包,是核心包,默认导入到用户程序,包中有obje ...