<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <title>Document</title>
　　//依赖项

    <script src="../node_modules/react/umd/react.development.js"></script>

    <script src="../node_modules/react-dom/umd/react-dom.development.js"></script>

    <script src="../node_modules/babel-standalone/babel.js"></script>

</head>

<body>

    <div id="app">

    </div>

    <script type="text/babel"> //jsx语法

        let a = ;

        ReactDOM.render(

        <h1 className='tit' style={{color:'red',fontSize:a+'px'}}></h1>, 
　　　　　　// 类名书写方式  内联样式 用{{}} 双括号 可以写变量

        // React.createElement('div',{style:{color:'red'}},'123'), 相当于render方法
　　　　　　//render(第一个参数是dom元素，第二个参数是样式，第三个参数显示的内容)

        document.getElementById('app')

    )

    </script>

</body>

</html>
//模板解析语法是{} 大括号一对

react初入门的更多相关文章

  1. React.js 入门与实战之开发适配PC端及移动端新闻头条平台课程上线了

    原文发表于我的技术博客 我在慕课网的「React.js 入门与实战之开发适配PC端及移动端新闻头条平台」课程已经上线了,文章中是目前整个课程的大纲,以后此课程还会保持持续更新,此大纲文档也会保持更新, ...

  2. React.js入门笔记

    # React.js入门笔记 核心提示 这是本人学习react.js的第一篇入门笔记,估计也会是该系列涵盖内容最多的笔记,主要内容来自英文官方文档的快速上手部分和阮一峰博客教程.当然,还有我自己尝试的 ...

  3. 基于Nodejs生态圈的TypeScript+React开发入门教程

    基于Nodejs生态圈的TypeScript+React开发入门教程   概述 本教程旨在为基于Nodejs npm生态圈的前端程序开发提供入门讲解. Nodejs是什么 Nodejs是一个高性能Ja ...

  4. 【转载】React初学者入门须知

    http://www.oschina.net/news/75530/9-things-every-reactjs-beginner-should-know react.js入门学习 看了一遍,没什么特 ...

  5. React Native入门教程 3 -- Flex布局

    上一篇文章中介绍了基本组件的使用 React Native入门教程(笔记) 2 – 基本组件使用及样式 本节内容将继续沿用facebook官方例子介绍如何使用Flexbox布局把界面设计的多样化. 转 ...

  6. React Native入门教程2 -- 基本组件使用及样式

    在上一篇文章中,我们学会了如何搭建React Native的环境(React Native入门教程(笔记) 1 – 开发环境搭建),不知道你们是否搭建好了呢,如果还没有,那么快动起小手,来体验RN带给 ...

  7. React Native入门教程 1 -- 开发环境搭建

    有人问我为啥很久不更新博客..我只能说在学校宿舍真的没有学习的环境..基本上在宿舍里面很颓废..不过要毕业找工作了,我要渐渐把这个心态调整过来,就从react-native第一篇博客开始.话说RN也出 ...

  8. React Native 入门基础知识总结

    中秋在家闲得无事,想着做点啥,后来想想,为啥不学学 react native.在学习 React Native 时, 需要对前端(HTML,CSS,JavaScript)知识有所了解.对于JS,可以看 ...

  9. React.js 入门与实战课程思维导图

    原文发表于我的技术博客 我在慕课网的「React.js 入门与实战之开发适配PC端及移动端新闻头条平台」课程已经上线了,在这里分享了课程中的思维导图,供大家参考. 原文发表于我的技术博客 此导图为课程 ...

随机推荐

  1. MVC+EF 序列化类型为“System.Data.Entity.DynamicProxies.__的对象时检测到循环引用

    用MVC+EF做简单查询时,返回json格式数据出现问题 原代码: public ActionResult JSon({ NorthwindEntities db = new NorthwindEnt ...

  2. Windows 7 X64 SQL Server 2000 企业管理器无法建立新表

    问题现象: 当建立新表时会出现一个空白的窗口,敲击键盘输入后就会出现应用出错,然后退出. 解决方案: 选中某个已经存在的表,再点右键,新建表就可以正常操作了.

  3. ubuntu下定时任务的执行

    概述 linux系统由 cron (crond) 这个系统服务来控制例行性计划任务.Linux 系统上面原本就有非常多的计划性工作,因此这个系统服务是默认启动的. 另外, 由于使用者自己也可以设置计划 ...

  4. javascript:针对yyyy-MM-dd hh:mm:ss格式的毫秒转换.

    javascript:针对yyyy-MM-dd hh:mm:ss格式的毫秒转换. 时间 2015-11-07 22:18:39  HideHai's blog 原文  http://www.hideh ...

  5. gear gym 思维题

    题目:https://vj.69fa.cn/1fc993e7e0e1e6fa7ce4640b8d46ef8d?v=1552762626 这个题目,之前有一点思路,但是呢,后来又不知道怎么去执行,然后就 ...

  6. 设计模式のChainOfResponsibilityPattern（责任链模式）----行为模式

    一.产生背景 职责链模式是一种行为模式,为解除请求的发送者和接收者之间的耦合,而使多个对象都有机会处理这个请求.将这些对象连接成一条链,并沿着这条链传递该请求,直到有一个对象处理它.避免请求发送者与接 ...

  7. mumu安卓模拟器使用教程

    安装教程: 1http://mumu.163.com/  在这网址里面下载 2.安装 我的是mac 安装时需要输入你的你电脑密码  但是也报错,你点击旁边的提示就会告诉去安全与隐私里点击允许就好了 很 ...

  8. JDK动态代理给Spring事务埋下的坑！

    一.场景分析 最近做项目遇到了一个很奇怪的问题,大致的业务场景是这样的:我们首先设定两个事务,事务parent和事务child,在Controller里边同时调用这两个方法,示例代码如下: 1.场景A ...

  9. 鼠标右键打开命令行cmd(管理员身份）

    参考:https://blog.csdn.net/bdss58/article/details/54745380 添加到注册表 将下面命令保存为reg文件: Windows Registry Edit ...

  10. UVA1623-Enter The Dragon（并查集）

    Problem UVA1623-Enter The Dragon Accept: 108  Submit: 689Time Limit: 3000 mSec Problem Description T ...