1.因为jsx将两个花括号之间的内容渲染为动态值，只需要引用对应的变量即可

<!DOCTYPE html>

<html>

    <head>

        <title>React JS</title>

        <script src="../build_0.13/react.js"></script>

        <script src="../build_0.13/JSXTransformer.js"></script>

    </head>

    <body>

        <div id="example"> </div>

        <script type="text/jsx">

            var h1 = "question";

            var Divider = React.createClass({

                    render:function(){

                        return (<div className="divider">

                                    <h1>{h1}</h1>

                                </div>

                                );

                    }

                });

            //将组件加到对应的元素上

            React.render( <Divider />, document.getElementById('example') );

        </script>

    </body>

</html>

React(0.13) 定义一个动态的组件的更多相关文章

  1. React(0.13) 定义一个动态的组件(属性)

    <!DOCTYPE html> <html> <head> <title>React JS</title> <script src=& ...

  2. React(0.13) 定义一个动态的组件(注释，样式)

    <!DOCTYPE html> <html> <head> <title>React JS</title> <script src=& ...

  3. React(0.13) 定义一个动态的组件(函数作为动态的值)

    <!DOCTYPE html> <html> <head> <title>React JS</title> <script src=& ...

  4. React(0.13) 定义一个checked组件

    <!DOCTYPE html> <html> <head> <title>React JS</title> <script src=& ...

  5. React(0.13) 定义一个多选的组件

    <!DOCTYPE html> <html> <head> <title>React JS</title> <script src=& ...

  6. React(0.13) 定义一个input组件，使其输入的值转为大写

    <!DOCTYPE html> <html> <head> <title>React JS</title> <script src=& ...

  7. React(0.13) 定义一个使用动画

    <!DOCTYPE html> <html> <head> <title>React JS</title> <script src=& ...

  8. React(0.13) 组件的组合使用

    <html> <head> <title>组件的组合调用</title> <script src="build_0.13/react.m ...

  9. React自己写的一个地图小组件

    由于今天比较闲,就玩了玩react,然后就封装了一个地图的组件,当然功能比较简单,因为就是随手写的小东西,但是由于引用了百度API和bee-mobile,所以用起来可能要薛微麻烦一点点,但是我保证,只 ...

随机推荐

  1. List 集合的交集

    private void Test() { List<string> lsA = new List<string>(); lsA.Add("A"); lsA ...

  2. bash shell redirecting code block

    参考了:https://www.cnblogs.com/sparkdev/p/10247187.html https://www.tldp.org/LDP/abs/html/redircb.html ...

  3. ESXI部署OVF模板提示用户已取消操作处理方法

    ESXI导出OVF部署到新的ESXI服务器上,Linux主机没有出现用户已取消操作的提示,部署WINDOW虚拟机的时候,提示用户已取消操作,如图: ​首先,要先了解为什么会出现这个问题,原因在于,在做 ...

  4. 深浅拷贝 python

    原文:http://www.jb51.net/article/15714.htm 1. copy.copy 浅拷贝 只拷贝父对象,不会拷贝对象的内部的子对象.2. copy.deepcopy 深拷贝 ...

  5. Jquery的分页插件

    Jquery的分页插件, 用起来还不错. 来自: http://flaviusmatis.github.io/simplePagination.js/   下载地址: https://github.c ...

  6. 教育单元测试mock框架优化之路（下）

    转载:https://sq.163yun.com/blog/article/169563599967031296 四.循环依赖的解决 果然! 当我将@SpyBean应用到存在有循环依赖的Bean上时, ...

  7. 从 bootup.js 学习加载脚本等资源

    本文内容 如何使用 示例 参考资料 本文的目的在于,通过 bootup.js 的源代码,认识如何从客户端加载服务器的文件,特别是 JavaScript 文件,注入到页面,并存储在本地缓存,以扩展对 J ...

  8. 【POJ 3071】 Football（DP）

    [POJ 3071] Football(DP) Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 4350   Accepted ...

  9. jQuery 用each后添加click

    mydd = $('.plist'); mydd.each(function(i){ $(this).click(function(){ mydl.eq(i).hide("slow" ...

  10. IE6.0 PNG背景透明图片插件

    <!--[if lte IE 6]><script src="http://xian.qq.com/js/2013js/2013index/DD_belatedPNG_0. ...