react初始（2）
既然我开始了react的学习，就没有停下来的理由了，我应该很幸运我还有这个时间去学习react，我不认为我聪明，但是我认为我够努力。我先在或许是一个不知道未来该是怎样的人，我们的迷茫和无知源于你不去接受新事物，干程序员这一行，成为大牛很难吗？我觉得不难，咱们这一行又不是在搞研究，就像造房子我们的工人，图纸是他们设计的吗？不是！他们只是按照图纸去盖好一栋漂亮的房子，我们这些程序员就好比民工，JavaScript是不是我们创造的，jQuery不是我们发明的，anjularJs也不是我们创造的，我们只是按照客户的的需求，老板的安排，让我们按照“图纸”去建房子，那地方需要砖块，哪地方需要门窗等等，初级的程序员就像小工，那些大牛只不过多和了几年泥，这个比方或许有差别，并没有表示对他们的不敬，反而也很渴望成为他们那样的人。打这个比方就是让给自己说，图纸不是我们设计的，底层不是我们搭建的，所以有些技术 难吗？恩，有些是挺难的，不过只要付出时间和经理，你也可以成为技术熟练的“民工”，现在讲架构，讲逻辑，讲模块化，我还不能插上什么嘴，who care? Go head!
恩，说了一堆废话，就是给自己打打气，每天给自己定的目标是阅读20篇技术文章，这20篇文章要来至不同的技术网站，每篇文章限定在3-5分钟，不巧我只阅读了12篇今天，如果这样算来，一周，一个月 ，一年下来，将是一个很庞大的数字，或许在 短期内你看不到效果，但是长期下，效果将是巨大的，我姑且先这样给自己打气吧。今天的学习笔记内容是：属性，状态，生命周期函数，声明周期函数。
1.react数据传递的方式：
1—1.采用键值对的形式传递数据
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div id="App"></div>
<script src="lib/react.min.js"></script>
<script src="lib/react-dom.min.js"></script>
<script src="lib/browser.min.js"></script>
<script src="style.js"></script>
<script type="text/babel">
var HelloReact = React.createClass({
render : function(){
return(
<div style={style1.style3}>Hello React！<input type="text" value={this.props.name}/></div>
)
}
});
var data = "请输入内容"; //数据在组件尚未初始化的时候传进来，数据的格式可以是字符串、对象、数组
ReactDOM.render(<HelloReact name={data}/>,document.getElementById("App"));
</script>
</body>
</html>
传入的是对象的化具体形式如下：
<script type="text/babel">
var HelloReact = React.createClass({
render : function(){
return(
<div style={style1.style3}>Hello React！<input type="text" value={this.props.name.age}/></div>
)
}
});
var data = {age:"18",sex:"男"};
ReactDOM.render(<HelloReact name={data}/>,document.getElementById("App"));
</script>
如果data的数据形式是数组的话，形式和上面的差不多。
1-2.采用
react初始（2）的更多相关文章
- react初始（1）
前言:react框架的出现是因为Facebook在建设Instagram交流平台的时候要处理大量的数据流,但是行业流行的MVC框架并不能适合Facebook公司的要求,他们就组织了自己的人力来开发re ...
- react初始
一.一些基础概念 1.框架:基于整个项目的 2.库:在某个模块中单独使用,轻量级的 在vue中,DOM的操作时DOM指令调用js 在react中,所有的DOM 渲染都是由JS完成的 组件基于视图 模块 ...
- [转] React同构思想
React比较吸引我的地方在于其客户端-服务端同构特性,服务端-客户端可复用组件,本文来简单介绍下这一架构思想. 出于篇幅原因,本文不会介绍React基础,所以,如果你还不清楚React的state/ ...
- React 同构思想
作者:yangchunwen React比较吸引我的地方在于其客户端-服务端同构特性,服务端-客户端可复用组件,本文来简单介绍下这一架构思想. 出于篇幅原因,本文不会介绍React基础,所以,如果你还 ...
- 搭建一个简单的React项目
我是使用了create-react-app来搭建的基本框架,其中的原理和vue-cli差不多的脚手架.(当然也可以自己配置项目目录,这里我偷了一下懒) npm install -g create-re ...
- 二、React初体验之React组件创建
(中间因为应付各种考试,处理其他事情,隔了好时间没更新,现在终于有时间了,续上!) 本文为React初始体验,因此先不考虑文件如何组织,尽量以最简单的方式让大家了解React其中的原理. 在创建组件( ...
- 【转】Virtual DOM
前言 React 好像已经火了很久很久,以致于我们对于 Virtual DOM 这个词都已经很熟悉了,网上也有非常多的介绍 React.Virtual DOM 的文章.但是直到前不久我专门花时间去学习 ...
- 初学React，setState后获取到的thisstate没变，还是初始state？
问题:(javascript)初学React,setState后获取到的thisstate没变,还是初始state?描述: getInitialState(){ return {data:[]}; } ...
- 初始React Native
1.何是React Native: React-Native是:Facebook 在2015年初React.js技术研讨大会上公布的一个开源项目.支持用开源的JavaScript库React.js来开 ...
随机推荐
- opencv算法学习
1.改变图像的亮度和对比度: 算法介绍:对每一点像素值的r,g,b,值进行乘法和加法的运算. 代码使用: ; y < image.rows; y++ ) { ; x < image.col ...
- androidannotations 简单复制与点击事件（1）
现在最火的android开发框架 简单描述一下 这一篇简单描述寻找控件以及事件的使用 1.该方法可以不用写setconteview @EActivity(R.layout.activity_main) ...
- C#多线程介绍（下）
转载原文:这里是链接内容 转载原文:这里写链接内容 转载原文:这里写链接内容 (重要事情说三遍) 引言 本文主要从线程的基础用法,CLR线程池当中工作者线程与I/O线程的开发,并行操作PLINQ等多个 ...
- 什么是XA事务
什么是XA事务 分布式事务处理是指一个事务可能涉及多个数据库操作分布式事务处理的关键是必须有一种方法可以知道事务在任何地方所做的所有动作,提交或回滚事务必须产生一致的结果(全部提交或全部回滚). XA ...
- ENode框架Conference案例分析系列之 - 事件溯源如何处理重构问题
前言 本文可能对大多数不太了解ENode的朋友来说,理解起来比较费劲,这篇文章主要讲思路,而不是一上来就讲结果.我写文章,总是希望能把自己的思考过程尽量能表达出来,能让大家知道每一个设计背后的思考的东 ...
- 探索c#之跳跃表(SkipList)
阅读目录: 基本介绍 算法思想 演化步骤 实现细节 总结 基本介绍 SkipList是William Pugh在1990年提出的,它是一种可替代平衡树的数据结构. SkipList在实现上相对比较简单 ...
- 递归算法经典实例小结(C#实现)
一 .递归算法简介 在数学与计算机科学中,递归是指在函数的定义中使用函数自身的方法. 递归算法是一种直接或者间接地调用自身算法的过程.在计算机编写程序中,递归算法对解决一大类问题是十分有效的,它往往 ...
- SQL Server 备份迁移策略
标签:SQL SERVER/MSSQL SERVER/数据库/DBA/xp_cmdshell/备份压缩 概述 当备份空间不是很充裕的情况下需要找方法将备份文件拷贝到专用的备份机器上去,特别是存储空间不 ...
- ASP.NET MVC 5 - 开始MVC5之旅
本教程将使用Visual Studio 2013手把手教你构建一个入门的ASP.NET MVC5 Web应用程序.本教程配套的C#源码工程可通过如下网址下载:C#版本源码链接.同时,请查阅 Build ...
- 【转】Spark常见问题汇总
原文地址:https://my.oschina.net/tearsky/blog/629201 摘要: 1.Operation category READ is not supported in st ...