混合开发的大趋势之一个Android程序员眼中的 React.js 块级作用域和 let

本文链接：https://blog.csdn.net/ddwhan0123/article/details/52681169

转载请注明出处：王亟亟的大牛之路

最近都有事干然后，快到月底了这个月给CSDN的博文也就两篇，想想也蛮多天没更了，那就来一篇。

老规矩，先安利：https://github.com/ddwhan0123/Useful-Open-Source-Android (已经拆完了，基本可以根据链接找你的需要的东西给了，后期还会继续细分)

学了一段时间的RN，公司项目的部分模块也迁移到了RN。
我自己是会SE的东西却对JS不太熟，所以生产效率并不是太高，正好微信的小程序也是类似的实现，让我觉得掌握JS已经成了一个高优先级的学习任务了。

然后当下有2个学习方向其实我觉得还是可以自己去选择的，一个是 VUE 一个是 React.js

一个是阿里等大公司都推崇的：https://github.com/vuejs/vue，另一个看标题你就懂了：https://facebook.github.io/react/index.html

Hellow World

例子中可能出现在 RN文章里出现过的知识点，如果重复了，可以提出我再做修改。

下完所需的JS包简单的包分一下就能开工
这里写图片描述

官方的sample引用的是 react.js,react-dom.js和browser.min.js 这3个文件

这里补充一句，Browser.js是用来把JSX转成JS的，这个过程比较耗时，丢服务器就行，Demo是为了方便，你懂的

在<head>里引用即可(记得设置下编码，不然中文就是乱码)

<head>
    <meta charset="UTF-8" />
    <script src="../build/react.js"></script>
    <script src="../build/react-dom.js"></script>
    <script src="../build/browser.min.js"></script>
  </head>

因为React.js的JSX语法和JS是不兼容的（别问为什么，我并不知道），要使用需要加一个<script>标签

<script type="text/babel">

然后在里面代码就行了！

变成都是从Hellow World开始的，我们也试着来一个。

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
    <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"/>
    <script type="text/babel">

      var wjj = 'hellow world';
      ReactDOM.render(
        <div>{wjj}</div>,
        document.getElementById('example')
    );

    </script>
</body>
</html>