react负责逻辑控制 reactdom负责渲染本节知识点 有
1)变量的使用,简单使用。1==》jsx中的注释
{/* */}2===》 简单的渲染
app.js
ps==>定义变量 使用变量import React from 'react';
function App() {
const namet="我是表头";//定义变量
return (
<div>
{/*我是注释 下面使用变量 它是表达式 */}
{namet}
</div>
);
}
export default App;
03==>
jsx 里面支持出绝大多数的js 你当jsx当做js就好了04==》在表达式{ }里面不要去写for循环和if else哈05==》在表达式里面去调用函数 import React from 'react';
function getsay(a,b){
return a+b;
}
function App() {
return (
<div>
{/*我是注释 下面使用变量 它是表达式 */}
{getsay(10,20)}
</div>
);
}
export default App;
06===>属性也是表达式
{/* 属性也是表达式 */}
<img src={login} title="我是图" style={{width:'50px'}}/>完整代码如下
import React from 'react';
import login from "./logo.svg" //导入图片function App() {
return (
<div> {/* 属性也是表达式 */}
<img src={login} title="我是图" style={{width:'50px'}}/> </div>
);
}
export default App;
07==>jsx也是表达式import React from 'react';
import login from "./logo.svg"
const jsx=<p>我是p</p>function App() {
return (
<div> {/* 属性也是表达式 */}
<img src={login} title="我是图" style={{width:'50px'}}/> {/* js也是表达式 */}
{jsx} </div>
);
}
export default App;总结==》属性也是表达式 jsx也是表达式