前端-【学习心得】-react2

今天是除夕,首先恭祝大家新年快乐。新年的确是值得开心的,过去一年过得不好就把它抛到后面,过得好就期待新一年过得更好。

好了,下面继续我们的react之旅。

我们的界面是有许多简单组件组成的,就像我们的身体是由各个器官组成的一样。我们想做一个可以复用的接口,定义它的名字CommentBox,定义这个盒子的组成由标题,列表项和表单组件构成。标题我们直接写在CommentBox里面,对于列表项和表单已经不是单元级别的,所以也把它们定义为组件。

定以组件列表

CommentList

var CommentList = React.createClass(

{ render: function() { return ( <div className="commentList"> Hello, world! I am a CommentList. </div> ); }

});

定义表单

var CommentForm = React.createClass({ render: function() { return ( <div className="commentForm"> Hello, world! I am a CommentForm. </div> );}

});

其实这两项都非常简单,这里的目的还是为了说明组件化思想。

 

最后看看完整的box

var CommentBox = React.createClass(

{ render: function() { return (

<div className="commentBox"> <h1>Comments</h1> <CommentList /> <CommentForm /> </div> ); }

});

可以看到这里混合了组件和html标签

以上的教程代码全部都来自于官网教程。

 

有时候我会想我们学习是不是应该从最高级的整体框架入手,先明白我们要做什么,然后再去学怎么做,但是现在学习方式貌似都是先教你怎么做,自己再取摸索到底要做什么,当然这只是我个人看法,不过不管如何,我们都应该孜孜不倦的去追求我们不了解却渴望了解的东西。无论如何,追求自己喜欢的东西都是正确的,假如你不太喜欢金钱至上的观念,却又无法摆脱世俗的看法,那么你就做自己喜欢的就行了。就像阿甘那样,当然能赚到钱也是极好的,不是吗。

原文地址:https://www.cnblogs.com/wq123/p/4396430.html