注意点

单大括号中可以使用任意的表达式

jsx自身也是js表达式

注意:js中的对是一个例外 写在style样式中

//导入react
    import React from "react"
     
    import ReactDOM from "react-dom"
     
    //第一步创建jsx创建react元素
    const fangfang=<p>我是方方</p>
    const name="geyao"
    const sayHi=()=>"geyao"
    const title =(<h1>
        <p className={{color:"red"}}>hello {name}</p>
        <p>{sayHi()}</p>
        <p>{1}</p>
        {fangfang}
    </h1>)
     
    //第二步渲染React元素
    ReactDOM.render(title,document.getElementById("root"))

好客租房14-在jsx中使用javascript表达式的注意点的更多相关文章

  1. 好客租房13-在jsx中使用javascript表达式

    嵌入js表达式 数据存储在js中 语法{javascript表达式} 注意语法中是单大括号 不是双大括号 //导入react     import React from "react&quo ...

  2. 006——VUE中的内容与属性中使用javascript表达式的方法

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. 好客租房9-jsx的学习目标

    1能够知道什么是jsx 2能够使用jsx创建react元素 3能够在jsx使用javascript表达式 4能够使用jsx的条件渲染和列表渲染 5能够给jsx添加样式 jsx的基本使用 jsx中使用j ...

  4. 好客租房15-jsx中的条件渲染

    jsx中的条件渲染 场景:loding效果 条件渲染:根据条件渲染特定的jsx结构 可以使用if/else或者三元运算符和逻辑和运算符实现 //导入react import React from &q ...

  5. 好客租房29-从jsx中抽离事件处理程序

    从jsx中抽离过多js逻辑代码 会显得非常混乱 推荐:将逻辑抽离到单独的方法中 保证jsx结构清晰 //导入react     import React from 'react'           ...

  6. JavaEE在职加薪课好客租房项目实战视频教程

    JavaEE在职加薪课好客租房项目实战视频教程课程介绍:       本课程采用SOA架构思想进行设计,基于目前主流后端技术框架SpringBoot.SpringMVC.Mybaits.Dubbo等来 ...

  7. 在Swift中使用JavaScript的方法和技巧

    本文作者Nate Cook是一位独立的Web及移动应用开发者,是继Mattt大神之后NSHipster的主要维护者,也是非常知名活跃的Swift博主,并且还是支持自动生成Swift在线文档的Swift ...

  8. js-js实现,在HTML中使用JavaScript,基本概念

    Js实现: 1.JavaScript实现的组成: 核心(ECMAScript):由ECMA-262定义,提供核心语言功能 文档对象模型(DOM)提供访问和操作网页内容的方法以及接口 浏览器对象模型(B ...

  9. 第十一章:WEB浏览器中的javascript

    客户端javascript涵盖在本系列的第二部分第10章,主要讲解javascript是如何在web浏览器中实现的,这些章节介绍了大量的脚本宿主对象,这些对象可以表示浏览器窗口.文档树的内容.这些章节 ...

随机推荐

  1. 3. Git安装和使用

    3. Git安装和使用 目的 通过git管理github托管项目代码 下载安装 1)GIt官网下载:https://www.git-scm.com/download/win 2)双击安装 3)选择安装 ...

  2. javascript 理解和使用回调函数

    在javascript中,function是内置的类对象,也就是说它是一种类型的对象,可以和其他String.Array.Number.Objec类的对象一样用于内置对象的管理.因为function实 ...

  3. 简单vue项目脚手架

    简单vue项目脚手架 github地址 使用技术栈 webpack(^2.6.1) webpack-dev-server(^2.4.5) vue(^2.3.3) vuex(^2.3.1) vue-ro ...

  4. PAT B1061判断题

    题目描述: 判断题的评判很简单,本题就要求你写个简单的程序帮助老师判题并统计学生们判断题的得分. 输入格式: 输入在第一行给出两个不超过 100 的正整数 N 和 M,分别是学生人数和判断题数量.第二 ...

  5. js判断json数据是否存在某字段的方法

    方式一 !("key" in obj) if("name" in json){//json就是数组,name是你要找的值 console.log("有 ...

  6. 前后端分离mockjs以及webpack-dev-server代理

    一: 在webpack中使用mockjs  mockjs 也就是模拟数据(mock.js模拟的数据可以不跨域) 安装mock新建mock.js var Mock = require('mockjs') ...

  7. Blazor组件自做二 : 使用JS隔离制作手写签名组件

    Blazor组件自做二 : 使用JS隔离制作手写签名组件 本文相关参考链接 JavaScript 模块中的 JavaScript 隔离 Viewer.js工程 Blazor组件自做一 : 使用JS隔离 ...

  8. ubuntu连接不到WiFi

    ubuntu连接不到WiFi 在软件与更新中,进入附加驱动. 搜到对应的无线网卡驱动,安装后在重启电脑.

  9. springboot集成spring security安全框架入门篇

    一. :spring security的简介 Spring Security是一个能够为基于Spring的企业应用系统提供声明式的安全访问控制解决方案的安全框架.它提供了一组可以在Spring应用上下 ...

  10. Rb(redis blaster),一个为 redis 实现 non-replicated 分片的 python 库

    Rb,redis blaster,是一个为 redis 实现非复制分片(non-replicated sharding)的库.它在 python redis 之上实现了一个自定义路由系统,允许您自动定 ...