这周做的demo3和demo4、5 随记的小点。

1、js错误提示: Warning: Each child in an array or iterator should have a unique "key" prop. Check the render method of `HelloMessage`. See https://fb.me/react-warning-keys for more information.

 
 
解决办法,给组件加个key属性,并赋值唯一key值用来标识。
2、state值改变——this.state.isVisible  或  this.setState({isVisible:true})
 
两种方式, this.setState() ----  及时刷新dom的时候,
                    this.state()  ----单独使用不能及时刷新dom,需要使用forceUpdate()
3、props  实现父组件传递数据到子组件
getDefaultProps:设置默认属性,返回一个对象
 
4、事件。直接使用value给input赋值,而不加onchange事件来监听的话。所得到的input只有你代码里设置的value值。用户不能直接改变input的值。可以用defaultValue而不是value来设置。或者加个onchange事件。

React 随笔二的更多相关文章

  1. jQuery和react实现二维码

    jq如何生成二维码 代码如下: 1.jquery.qrcode生成二维码代码 <!DOCTYPE html> <html> <head> <script ch ...

  2. React Native (二) ios打包到真机

    每当在模拟器上完成了开发,都想到真机上试试,正好前段时候淘了一个imac. 这里就以打包rndemo到iphone为例,讲一下react ntive ios打包到真机的流程. 一.前置 1.有个iph ...

  3. 22.2、react生命周期与react脚手架(二)

    一.类:es6 <script type="text/babel"> class Person{ age = 10; constructor(name){ this.n ...

  4. Alpha冲刺随笔二:第二天

    课程名称:软件工程1916|W(福州大学) 作业要求:项目Alpha冲刺(十天冲刺) 团队名称:葫芦娃队 作业目标:在十天冲刺里对每天的任务进行总结. 随笔汇总:https://www.cnblogs ...

  5. React Native 二维码扫描组件

    学rn得朋友们,你们知道rn开源项目吗?来吧看这里:http://www.marno.cn/(rn开源项目) React Native学习之路(9) - 注册登录验证的实现 + (用Fetch实现po ...

  6. react(二):组件的通信

    对于组件来说,通信无非两种,父子组件通信,和非父子组件通信 一.父子父子组件通信 1.父组件给子组件传值 对于父组件来说,props是他们之间的媒介 class Parent extends Comp ...

  7. 前端笔记之React(二)组件内部State&React实战&表单元素的受控

    一.组件内部的State 1.1 state state叫状态,是每一个类式组件都有的属性,但函数式组件,没有state. state是一个对象,什么值都可以定义. 在任何类式组件的构造函数中,可以用 ...

  8. 从 Vue 的视角学 React(二)—— 基本语法

    基于 Vue.js 开发的时候,每个 vue 文件都是一个单独的组件,可以包含 HTML,JS,CSS 而 React 是以函数为基础,每个 function 就是一个组件.虽然 JSX 让 HTML ...

  9. react生成二维码

    图片实例: 简介: QRCode.js 是一个生成二维码的JS库.主要是通过获取 DOM 的节点,再通过 HTML5 Canvas 绘制而成,不依赖任何库. 用法: 1. 在项目中引入qrcode.m ...

随机推荐

  1. Android WIFI 分析(二)

    本文介绍Wifi 分析线路二:在Setting中打开WiFi功能.扫描网络以及连接网络的流程. WifiSettings 无线网络设置界面 WifiEnabler 相当于无线网络设置开关 WifiDi ...

  2. 初涉定制linux系统之——自动化安装Centos系统镜像制作

    最近碰到个需求:要在内网环境安装centos6.5系统并搭建服务,但由于自动部署脚本里安装依赖包使用的是yum安装,而服务器无法连接外网,实施人员也不会本地yum源搭建O__O "….. 本 ...

  3. Centos 压缩、解压和打包命令

    gzip命令 --功能说明:gz文件的压缩和解压缩. --命令格式:gzip [参数] <文件> --常用参数: -d 解开压缩文件 -l 列出压缩文件的相关信息 -q 不显示警告信息 - ...

  4. 04-JAVA中的类和对象

    1. Foo对构造函数进行了重载,那么默认的构造函数就不会被使用,在主类中,定义对象的时候,引用构造函数,却没有参数,自然无法通过编译. 2. 当设定字段初始值在初始化块前面的时候, 很明显使用了前者 ...

  5. MAVEN解决Cannot change version of project facet Dynamic web module to 2.5

    我们用Eclipse创建Maven结构的web项目的时候选择了Artifact Id为maven-artchetype-webapp,由于这个catalog比较老,用的servlet还是2.3的,而一 ...

  6. read函数返回值始终为1

    部分程序如下: while(count=read(fd_s,buf,512)>0)      printf("count=%d\n",count);      write(f ...

  7. Shell使用技巧

    巧用定界符delimiter 输入大段文本的地方 自动选择和输入的地方 访问数据库 Angel@DESKTOP-254LBLA ~ $ cat > out.txt << EOF &g ...

  8. struts2一些概念介绍和标签的使用

    依赖注入 模块包含 struts.xml的模块包含格式 <include file="xx.xml" > OGNL 对象导航语言   有个超大的好处就是根据对象访问属性 ...

  9. RGB颜色中的参数是变量的时候,为什么要加上两个+号在左右?

    <script> function draw(){ var c=document.getElementById("mycanvas"); var cxt=c.getCo ...

  10. 模拟XShell的小项目

    不知道大家有没有用过XShell这款工具,这款工具通过windows可以远程操作处于开机状态的linux操作系统,也就是说把你的电脑和一台服务器连入网络,你通过输入服务器所在的IP地址建立一个会话就可 ...