首页 > 其他分享 >jsx中使用js表达式

jsx中使用js表达式

时间:2023-04-26 21:13:08浏览次数:38  
标签:const js 注释 span jsx 表达式

// 在jsx中使用 js 表达式

/// 通过一个 {} 展示变量即可  vue 中使用 {{}} 展示js表达式

// 什么是js表达式 有结果的 
import reactDom from "react-dom"

// 函数也是表达式
// syntaxError 语法错误
const sayHi = () => {
    return "你好"
}

const span = <span>我是一个span标签但是我也是表达式</span>

const name = "朱龙旭"

const h1 = (<>
        {/*我是jsx的注释内容不显示在页面*/}
        {
            // {}里面就是js的注释内容了 【js注释的写法】
            // 我是注释
            // 我是注释
            // 我是注释
        }
        <h1 className="demo">hellow {name}</h1>
        <h1 className="demo">{sayHi()} {name}</h1>
        <div></div>
        {span}
    </>)
reactDom.render(h1,document.querySelector("#root"))

 

标签:const,js,注释,span,jsx,表达式
From: https://www.cnblogs.com/zhulongxu/p/17357351.html

相关文章

  • jsp 自定义标签
    新疆web工程:Java代码:packagecom.tld.bean;publicclassUserInfo{ privateStringusername; privateintage; publicStringgetUsername(){ returnusername; } publicvoidsetUsername(Stringusername){ this.username=username; } publicintgetA......
  • 关于idea使用Tomcat打开jsp文件页面失败的问题的解决
    问题描述在idea里面使用Tomcat打开jsp文件频繁报错,检查相关路径也没有任何问题,而且用来测试的jsp文件还是最简单的形式,困扰了大概5分钟左右问题解决经过查询百度可知,这次不是路径的问题,而是需要将我们在web文件夹里面创建的jsp文件复制到target文件夹里面保持与target文件夹里......
  • 第三十二章 JSON
    学习要点:1.JSON语法2.解析和序列化前两章我们探讨了XML的结构化数据,但开发人员还是觉得这种微型的数据结构还是过于烦琐、冗长。为了解决这个问题,JSON的结构化数据出现了。JSON是JavaScript的一个严格的子集,利用JavaScript中的一些模式来表示结构化数据。一.JSON语法JSON......
  • [Node.js] Hanlde process.env with dotenv
    import*asdotenvfrom"dotenv";constresult=dotenv.config();if(result.error){console.log('Errorloadingenvironmentvariables,aborting.')process.exit(1)}console.log(process.env.PORT) ......
  • NodeJs through处理流
    through2主要是基于streams2(2指的是API稳定性)封装的transformstream。其内部仅是封装了Transform的构造函数,以及更为易用的objectMode模式。through2并未引用node默认提供的stream模块,而是使用社区中较为流行的readable-stream模块,主要是为了对之前node版本做了兼容支持。我......
  • Nodejs中流的操作,实现简单的pipe
    fs与流都可以处理文件,为什么还要用流?fs模块处理文件的缺点:将文件的数据全读到内存中,在把数据写到文件内,会大量占用内存。流介绍:      流(stream)是Node.js中处理流式数据的抽象接口,是一组有序的,有起点和终点的字节数据传输手段。可以实现将数据从一个地方流动到另一个......
  • Java8 Lambda表达式教程
    1.什么是λ表达式 λ表达式本质上是一个匿名方法。让我们来看下面这个例子:   publicintadd(intx,inty){       returnx+y;   }转成λ表达式后是这个样子:       (intx,inty)->x+y;参数类型也可以省略,Java编译器会根据上下文推断出来:  ......
  • OGNL表达式语言介绍
    OGNL表达式语言介绍[code]OGNL介绍OGNL是Object-GraphNavigationLanguage的缩写,它是一种功能强大的表达式语言(ExpressionLanguage,简称为EL),通过它简单一致的表达式语法,可以存取对象的任意属性,调用对象的方法,遍历整个对象的结构图,实现字段类型转化等......
  • Jsp基础知识总结
    [code]首先来说一下我们jsp的课程:第一部分为Servlet技术,包括Servelt入门,会话跟踪,JavaMal和Servlet.第二部分就是Jsp技术,包括:jsp简介,jsp脚本和指令的使用,jsp隐式对象,JavaBean与jsp中的标准动作,jsp表达式语言,自定义标签,jsp自定义表签库.第三部......
  • 精通struts2的ognl表达式
    精通struts2的ognl表达式[code]Struts2中内置了OGNL表达式的支持,使得Struts2的具有比Struts1更为强大的数据访问的功能。本文主要讲解OGNL的使用方法,并不会去讲解一些原理性的东西,想要了解的朋友可以自己去查阅相关的资料在OGNL的使用主要分以下部分来......