关于reactjs

最新推荐文章于 2022-01-13 14:20:12 发布

Hi_JohnsonYu

最新推荐文章于 2022-01-13 14:20:12 发布

阅读量468

点赞数

分类专栏： javascript

本文链接：https://blog.youkuaiyun.com/yuqixiansheng/article/details/52199709

版权

javascript 专栏收录该内容

3 篇文章

订阅专栏

Bootstrap 和 AngularJS 一个是做UI和响应式布局的,一个是前端做MVC层解耦合的.二者都很强大,不过bootstrap包比较庞大,在移动端运行不流畅,更适合做PC段的web.AngularJS,最大特点是采用了双向绑定,和依赖注入的方式对前端进行解耦合.不过采用的是传统的MVC,对于大的数据流更新处理很麻烦. ReactJS估计就是看到这点才应运而生.

React 采用了VDOM取代传统浏览器DOM的笨重渲染方式.另外JSX语法让写JS更加直观.当然这些都不是重点.重点还是组件化.一个组件一旦写好就可以反复的在别的地方使用.这个是bootstrap 做不到的.你每次得写一堆的html代码,设置class.即便是要复制现成的代码块,我都嫌累.React只要用一个组件标签设置下就用了.在模块之间解耦方面,采用了flux 设计模式.让界面随着数据的流动动态的进行渲染.布局方面采用的是flex box 布局.比响应式布局和传统的 css box 模型更灵活,也更容易.

reactjs 可以用node 进行安装,react-tools实时编译JSX.

<!DOCTYPE html>
<html>
  <head>
    <script src="../build/react.js"></script>
    <script src="../build/react-dom.js"></script>
    <script src="../build/browser.min.js"></script>
  </head>
  <body>
    <div id="example"></div>
    <script type="text/babel">
      ReactDOM.render(
        <h1>Hello, world!</h1>,
        document.getElementById('example')
      );
    </script>
  </body>
  </html>

在react 0.14前，浏览器端实现对jsx的编译依赖jsxtransformer.js
在react 0.14后，这个依赖的库改为browser.js
页面script标签的type也由text/jsx改为text/babel
但是以上只能用来测试学习react
生产环境需要借助编译工具事先将jsx编译成js
对应的这个工具也由react-tool更换为babel

作者：王金亮
链接：http://www.zhihu.com/question/37389040/answer/78688199
来源：知乎
著作权归作者所有，转载请联系作者获得授权。