// 在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"))

03-jsx中使用js表达式的更多相关文章

  1. React - redux, jsx中写js示例

    { this.state.avatarSource === null ? <Text>Select a Photo</Text> : <Image style={styl ...

  2. 在 WXML 中使用 JS 代码

    {{}} 里面可以写任何的 JS 表达式,(一定是表达式,例如定义函数等都不属于表达式).例如,下面是在 wxml 中使用 JS 表达式: <view class="price tex ...

  3. js 中使用el表达式 关键总结:在js中使用el表达式一定要使用双引号

    js 中使用el表达式 关键总结:在js中使用el表达式一定要加双引号 js控制中用到了el表达式,最开始源码如下: var selected = ${requestScope.xxxxForm.re ...

  4. js文件中使用EL表达式的问题

    var str = '${str}' ; var str = '${obj.属性名}'; 只可以再jsp页面的<script></script>中使用,外部引入的js文件中不能 ...

  5. 转:el表达式获取map对象的内容 & js中使用el表达式 & js 中使用jstl 实现 session.removeattribute

    原文链接: ①EL表达式取Map,List值的总结 ②在jsp中使用el表达式通过键获得后台的一个map<Long,String>的值 ③在javascript中使用el表达式(有图有真相 ...

  6. 怎样在js中使用EL表达式

    相信已经有很多人对如何在js中使用EL表达式存有困惑,各种引号的处理不胜其烦. 1.在js(嵌入jsp页面)中通过定义变量的方式使用EL表达式: 如:var url = '${param.url}'; ...

  7. JS中使用EL表达式方法与获取工程名字

    关键: 在js中使用el表达式一定要使用双引号      分两种情况 1. JS代码在JSP页面中, 这可以直接使用EL表达式. 如: <script type="text/javas ...

  8. js中“使用”el表达式

    在说相关内容前,一定要先熟悉jsp运行原理: http://blog.csdn.net/lmsnju/article/details/4813488 http://hi.baidu.com/mingf ...

  9. js中使用EL表达式总结

    1.js中使用el表达式要加双引号或单引号:'${list}' 2.js变量获取el表达式中的对象:不能直接获取,直接获取得到的是该对象的toString值. 有两种方法:一:el中直接写对象的属性v ...

  10. JS中输出EL表达式

    要在javascript中使用El表达式,需要在el表达式两端加上单引号或者双引号 <script type="text/javascript"> jQuery(doc ...

随机推荐

  1. 【Java】匿名表达式 + 构造块

    来源自同事的一个代码截图 可以看见最后一行装填HashMap的语法非常的不常见 在我整理思绪之后才明白这语法是使用了 匿名内部类 + 对象构造代码块 一般使用场景是发生在容器对象的创建上,因为有些时候 ...

  2. 【RabbitMQ】02 工作队列模式

    首先编写一个工作队列的生产者: 发送10条消息然后就关闭,10条消息让RabbitMQ先存着 import com.rabbitmq.client.Channel; import com.rabbit ...

  3. 【DataBase】MySQL根据父节点查询下面的所有子节点

    表结构如下: /* Navicat Premium Data Transfer Source Server : 主机 Source Server Type : MySQL Source Server ...

  4. 【H5】07 网页调试

    摘自: https://developer.mozilla.org/zh-CN/docs/Learn/HTML/Introduction_to_HTML/Debugging_HTML HTML 优雅明 ...

  5. 【ActiveJdbc】01 入门

    官方快速上手文档: https://javalite.io/activejdbchttps://javalite.io/getting_started 完整介绍: https://javalite.i ...

  6. 【Vue】Re13 CLI(Command Line Interface)

    一.What is CLI Command Line Interface 命令行接口 但是说是命令行界面,在官方又被称为脚手架 一个单词三个意思,所以令人困惑 但是根据实际意义用途来说就是帮助开发者更 ...

  7. 人形机器人 —— Figure 01机器人亮相 | OpenAI多模态能力加持 | 与人类流畅对话交互 | 具身智能的GPT-4时刻

    视频地址: https://www.youtube.com/watch?v=vO1wnHA0tZg Figure AI 公司主页: https://www.figure.ai/ 根据Figure 01 ...

  8. 如何配置docker pull代理

    参考: https://blog.csdn.net/vic_qxz/article/details/130061661 经过验证确实有效.

  9. Meissel_Lehmer模板

    复杂度 \(O(n^\frac 23)\),计算 \(1\sim n\) 的素数个数 #define div(a, b) (1.0 * (a) / (b)) #define half(x) (((x) ...

  10. vs code 快速配置

    1. 基本操作 打开工程文件: ctrl + p 在文件搜索内容: ctrl + shift + f 进入设置: ctrl + shift + p, 然后输入 user setting 添加插件: c ...