让前端飞Web前端之路

react项目

2017-10-19  本文已影响23人  月光在心中

react项目

脚手架:create-react-app

创建模块可使用:create-component-app
npm install -g create-component-app

react.js 核心文件
react-dom.js 处理dom的文件

组件

拥有独立功能的一个模块
React还提供组件的另外一种使用的方式:标签化
标签化 传参:通过标签属性传入

后端渲染

传统的JavaScript富应用的问题是比较慢,用户体验差,同时对搜索引擎不友好。因此,业界开始探索JavaScript的服务器端渲染。
早期的做法,在服务器端根据不同技术选择不同的模板进行,如Rails的ERB模板,Java的Mustache、HandleBar、Velocity等等。
而React通过ReactDomServer,同样一个React组件,现在也可以用于后台渲染,达到了真正前后端同构,前后端只要维护一套代码。在解决SEO的同时,又可以组件前后端复用,这是其他很多MVVM框架很难做到的。

jsx语法:

  1. 结构中有且只能有一个顶级元素。
  2. 支持插值表达式:{1+2},这个就是在xml中插入一个表达式。
    插值表达式中不能直接输出对象,但是一个数组对象则是可以的。
  3. 在标签上添加属性名=属性值,值必须使用引号包含。值可以使用插值表达式,此时不需要用引号。<h1 id={a}>hello</h1>
  4. style值必须使用对象,必须放在插值表达式中,两个大括号,第一个是插值表达式,第二个是对象。
  5. 没有模板语法,插值表达式中只支持表达式,不支持语句:for,if
上一篇 下一篇

猜你喜欢

热点阅读