React 学习：jsx 、变量定义、语法糖、三元表达式

灰太狼 2022-02-20 01:49 213阅读 0赞

1 定义变量：const

2 花括号的使用：\{\}

3 语法糖的体现

4 数组的遍历

import React from 'react'
    
    class Welcome extends React.Component {
        render() {
            // const todoList=['learn React','learn Redux']
            // const isLogin=false
            const test=<h1>hello react</h1>
            console.info(test)
            return (
                <div>
                    {
                        /* <h1>hello world</h1>
                     <ul>
                         {
                             todoList.map(itemthis=>
                                 <li>{item}</li>
                             )
                         }
                     </ul>*/
                        // isLogin ? <p>你已经登陆</p> : <p>请登录</p>
                    }
            </div>
            )
          };
    }
    
    export default Welcome;

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzMyNDIzODQ1_size_16_color_FFFFFF_t_70][]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzMyNDIzODQ1_size_16_color_FFFFFF_t_70]: /images/20220220/a64be98c1df14861b0b4b2aeeb86d429.png

发表评论取消回复

表情：

评论列表（有 0 条评论，213人围观）

还没有评论，来说两句吧...

相关阅读

相关【React】JSX语法

目录一、前言二、JSX介绍三、JSX原理 1、DOM结构示例 2、HTML的JSX结构示例 3、编译之后的

桃扇骨/ 2023年10月16日 14:08/ 0 赞/ 77 阅读

相关 react jsx语法

//调用react下面的createElement方法，传入第一个参数是tag //第二个是属性，第三个是子元素集合 import React

港控/mmm°/ 2023年07月06日 11:34/ 0 赞/ 70 阅读

相关 React-jsx语法

jsx语法是 react 的模板语法，是 react 的灵魂；通过该语法可以很方便的创建 react 对象 jsx 不是字符串也不是 html，就是 react 对象，其底层

朴灿烈づ我的快乐病毒、/ 2023年07月03日 07:28/ 0 赞/ 37 阅读

相关 React学习笔记一——JSX语法规则

> 之前看过两遍关于react基础的视频，每次看完感觉非常懂，但是过一段就会忘记，所以这次再学习自己会做一些笔记记录下来，方便日后的学习，如果对你有帮助，再好不过；通过以下

迈不过友情╰/ 2022年10月09日 00:34/ 0 赞/ 250 阅读

相关 Linux - ${变量#*/} 语法糖

案例 fileName=/usb/my.conf echo ${fileName/} 结果 usb/my.conf 原理

拼搏现实的明天。/ 2022年09月10日 05:29/ 0 赞/ 114 阅读

相关 React学习 -- JSX

React为了方便组件化，需要构建HTML结构化页面。那么React是如何操作的呢？答案是，React通过创建与更新虚拟元素来管理整个虚拟DOM。虚拟DOM是什么：由于DO

秒速五厘米/ 2022年06月17日 11:49/ 0 赞/ 261 阅读

相关 React 学习：jsx 、变量定义、语法糖、三元表达式

1 定义变量：const 2 花括号的使用：\{\} 3 语法糖的体现 4 数组的遍历 import React from 'react' c

灰太狼/ 2022年02月20日 01:49/ 0 赞/ 214 阅读

相关 react启动jsx语法

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ub

刺骨的言语ヽ痛彻心扉/ 2021年12月14日 03:07/ 0 赞/ 357 阅读

相关 React基础——JSX语法

JSX是React的核心组成部分，它使用XML标记的方式去直接声明界面，界面组件之间可以互相嵌套。可以理解为在JS中编写与XML类似的语言,一种定义带属性树结构（DOM结构）的

素颜马尾好姑娘i/ 2021年09月17日 01:56/ 0 赞/ 379 阅读

相关 react jsx语法

jsx语法 (1)遇到{}按照js语法解析,无<>时也按照js语法解析 (2)遇到<>按照html语法解析 (3)遍历时,每一个

ゝ一世哀愁。/ 2021年07月24日 15:17/ 0 赞/ 527 阅读