react学习笔记(二)React表单详解

一、不可控组件和可控组件介绍

什么是不可控组件

<input type="text" defaultValue="Hello World" />var inputValue = ?var inputValue = React.findDOMNode(this.refs.input).value

什么是可控组件

<input type="text" defaultValue={this.state.value} />
var inputValue = this.state.value  

为什么组件要可控

组件可控的好处:

1、符合React的数据流

2、数据存储在state中,便于使用

3、便于对数据进行处理

时间: 2024-07-29 10:40:32

react学习笔记(二)React表单详解的相关文章

React学习笔记-8-属性和状态详解

属性的含义和用法props=properties 英文中属性的意思.属性不可以修改,也就是属性不可以由组件进行修改,组件的属性是由父组件传递过来的,相当于组件在出生的时候带的. 用法第一种:直接在调用组件的时候传入一个键值对,  这个键值对可以是字符串: <HelloWorld name="李明"></HelloWorld> 可以是大括号:大括号本质上是一个js的求值表达式,里面可以写很多内容,最简单的就是写数据,直接拿到的数字 <HelloWorld n

[Spring MVC]学习笔记--表单标签的使用

github例子地址: https://github.com/lemonbar/spring-mvc-jsp 效果图 关于spring mvc的标签的讲解, 有一篇blog已经讲的很细了. http://haohaoxuexi.iteye.com/blog/1807330 官方文档地址: http://docs.spring.io/spring/docs/4.0.6.RELEASE/spring-framework-reference/htmlsingle/#view-jsp 而且我在上面的例子

学习笔记——Maven settings.xml 配置详解

文件存放位置 全局配置: ${M2_HOME}/conf/settings.xml 用户配置: ${user.home}/.m2/settings.xml note:用户配置优先于全局配置.${user.home} 和和所有其他系统属性只能在3.0+版本上使用.请注意windows和Linux使用变量的区别. settings.xml详解 声明规范 <?xml version="1.0" encoding="UTF-8"?> <settings x

学习笔记——Maven pom.xml配置详解

POM的全称是“ProjectObjectModel(项目对象模型)”. pom.xml详解 声明规范 <projectxmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0http://maven.apach

Struts2学习(二)———— 表单参数自动封装和参数类型自动转换

前篇文章对struts2的一个入门,重点是对struts2的架构图有一个大概的了解即可,之后的几篇文章,就是细化struts2,将struts2中的各种功能进行梳理,其实学完之后,对struts2的使用不外乎这几点,参数自动封装,拦截器的使用,数据校验,ognl表达(值栈和actionContext的讲解),struts2的标签,struts2的国际化,struts2的文件上传下载. 把这几个功能都学会了使用之后,struts2基本上就学完了.所以接下来的文章就是对这几个功能进行讲解.如何使用.

Yii学习笔记之四(表单验证 api 翻译)

1.表单验证 对于用户输入的所有数据,你不能信任,必须加以验证. 所有框架如此,对于yii 可以使用函数 yii\base\Model::validate()  进行验证 他会返回boolean值的 true /false 如果验证未通过,可以使用 yii\base\Model::$errors 属性进行处理,如下代码: <?php //加载表单模型(绝对地址方式) /*如果上面引入 use app\models\ContactForm; 则可以直接使用 $model = new Contact

knockoutJS学习笔记08:表单域绑定

前面的绑定都是用在基本标签上,这章主要讲表单域标签的绑定. 一.value 绑定 绑定标签:input text.textarea. <p>用户名:<input type="text" data-bind="value:name" /><span data-bind="text:name"></span></p> <p>密码:<input type="text

HTML学习笔记8:表单

什么是表单? 一个网页表单可以将用户输入的数据发送到服务器进行处理.因为互联网用户使用复选框,单选按钮或文本字段填写表格,所以WebForms的形式类似文件或数据库.例如,WebForms可以用来进入航运或信用卡资料订购产品,或可用于检索数据(例如,搜索引擎上搜索).    <!-- from wiki - > 简单来说就是收集用户的信息 这就是一个表单 表单的工作流程:用户打开页面->填写表单后提交->根据相应的方式打包后发送个服务器->服务器接收后转给相应的程序处理 基础

Python+Selenium学习笔记8 - 多表单&amp;多窗口切换

1.多表单切换 下图为待测页面:内嵌百度首页 切换到百度首页进行操作 1 # coding = utf-8 2 3 from selenium import webdriver 4 import os 5 import time 6 7 dr = webdriver.Firefox() 8 file_path = 'file:///' + os.path.abspath('frame.html') 9 dr.get(file_path) 10 11 # 切换到iframe(id="if"

HTML5之表单详解

请在新版标准浏览器(Chrome/Opera/Firefox/Safari...)中浏览本文中的样例,否则你看到的只是一个个空白的表单! ⊙﹏⊙|∣ 时光车轮滚滚碾来,前端之路永无止歇.对于这个前端这门精一多专的技术,任何一次技术革新,我们都必须第一时间去了解它学习它,比如Web世界里这簇美艳的花朵---HTML5.虽然HTML5发布之初,许多人(包括我)都觉得普及它还很遥远,但自发布以来,许多企业级网站对它的尝试应用(比如<!doctype html>应用,比如canvas的应用),使HTM