React JSX語法 元件

2022-06-01 23:45:12 字數 536 閱讀 3988

1.react示例

2.jsx語法

元素變數:

const dom = 我是乙個元素變數   //值為元素的變數稱為元素變數

引入外部js

3.classname

指定屬性值時(屬性值是乙個變數,不要在{}外加上雙引號)

let a = "one"

let b = "two";

reactdom.render((

我確定你就是那只匹著羊皮的狼

4. style.html   

5.列表渲染

6.//只能用乙個根元素。

// 遇到小寫的標籤會被視為普通標籤,如果遇到首字母大寫的標籤會被視為元件。如果遇到{},會被認為要輸出,或要解析表示式。

// no

// let arr = [1,2,3,4];

// yes:

// let arr = [1,2,3,4];

// yes:

//yes:

//no:

// reactdom.render(

學習react(JSX語法)

1.建立虛擬dom元素 const h1 react.createelement h1 大標題 第乙個引數 字串型別的引數,表示要建立的標籤的名稱 第二個引數 物件型別的引數,表示 建立的元素的屬性節點 第三個引數 子節點 使用jsx語法 安裝 babel 外掛程式 安裝能夠識別轉換jsx語法的包就...

React JSX 常量定義與使用

user是定義資料 const user 格式化資料 function formatname user 拼裝資料 const element 渲染資料 reactdom.render element,document.getelementbyid root 1.對於const表示constant的簡...

React jsx 中寫更優雅 直觀的條件運算子

在這篇文字中我學到了很多知識,同時結合工作中的一些經驗也在思考一些東西。比如條件運算子 condition expr if true expr if false 在jsx中書寫條件語句我們經常都會使用到的就是三目運算子 也叫內聯條件運算子,可能大家都有體會三目運算子並不是一種直觀的書寫方式。特別是在...