好客租房14-在jsx中使用javascript表达式的注意点

简介: 好客租房14-在jsx中使用javascript表达式的注意点

注意点

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

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




相关文章
|
JavaScript 前端开发
react 在js文件中实现和jsx页面的双向绑定
react 在js文件中实现和jsx页面的双向绑定
|
JavaScript 前端开发
ESLint:可组装的JavaScript和JSX检查工具
ESLint:可组装的JavaScript和JSX检查工具
109 0
|
XML JavaScript 前端开发
vue.js使用JSX语法扩展
vue.js使用JSX语法扩展
vue.js使用JSX语法扩展
|
JavaScript 前端开发
ESLint:可组装的JavaScript和JSX检查工具
ESLint:可组装的JavaScript和JSX检查工具
|
前端开发 JavaScript
好客租房14-在jsx中使用javascript表达式的注意点
好客租房14-在jsx中使用javascript表达式的注意点
66 0
|
存储 前端开发 JavaScript
好客租房13-在jsx中使用javascript表达式
好客租房13-在jsx中使用javascript表达式
55 0
|
存储 前端开发 JavaScript
好客租房13-在jsx中使用javascript表达式
好客租房13-在jsx中使用javascript表达式
61 0
|
JavaScript 前端开发
解决Vite-React项目中.js使用jsx语法报错的问题
解决Vite-React项目中.js使用jsx语法报错的问题
1295 0
|
JavaScript
React.js中JSX的原理与关键实现
在开始开发之前,我们需要创建一个空项目文件夹
React.js中JSX的原理与关键实现
|
前端开发 JavaScript
React jsx转换成原生JavaScript的一个例子
React jsx转换成原生JavaScript的一个例子
238 0
React jsx转换成原生JavaScript的一个例子