React JSX

作者: 灭绝小师弟 | 来源:发表于2020-03-28 20:47 被阅读0次

    React JSX

    • 使用JavaScript表达式需要加{},不能使用if..else..,可以使用三元运算
    • react推荐使用内联样式
    ReactDOM.render(
        <div className={{backgroundColor:'red',widht:100}}>
            哈哈哈哈
         </div>,
        document.getElementById('root')
    );
    

    即用对象表示样式,属性名使用驼峰法,指定元素数字后自动添加px。

    • 注释需要写在花括号中,例如
    ReactDOM.render(
        <div>
        {/*注释...*/}
         </div>,
        document.getElementById('root')
    );
    
    • 嵌套多个 HTML 标签,只能有一个顶层标签,或者直接在模板中插入数组,数组会自动展开所有成员
    ReactDOM.render(
        <div>
        <h1>学习</h1>
        <h2>React</h2>
        </div>
        ,
        document.getElementById('root')
    );
    #或者
    let arr = [
      <h1>学习</h1>,
      <h2>react</h2>,
    ];
    ReactDOM.render(
      <div>{arr}</div>,
      document.getElementById('root')
    );
    

    相关文章

      网友评论

          本文标题:React JSX

          本文链接:https://www.haomeiwen.com/subject/phzsuhtx.html