JSX笔记2.
首先
这是一个JSX的备忘录。
我是初学者。
我想有很多地方弄错了。
如果可以的话,希望您能给出指正,谢谢?
学习的内容
JSX的基本语法 ①
-
- import React from ‘react’;が冒頭に必要。
- returnの中がHTMLと同じ
const BlueButton = () => {
return (
<button class name={'btn-blue'}>
Click!
</button>
)
}
JSX的基本语法②
-
- キャメルケースで記述する(JavaScriptは-は使えないから文字と文字の間は次の文を大文字にする)
-
- {}内は JavaScriptの世界にできる。変数を扱える。
- 閉じタグが必要→一つのタグで完結する時に必要
JSX的注意事项
-
- JSXは必ず階層構造→並列にできない→一つの時には必要ない→2つ以上あるときのみ。
- React.Fragmentで階層を作れる→
return(
<React.Fragment>
<p>A</p>
<p>B</p>
</React.Fragment>
)
return(
<>
<p>A</p>
<p>B</p>
</>
)
这两个会得到相同的结果(转换了)→等意的语句
需要注意的事项
-
- JavaScriptの記述方法を使う
-
- {}内は JavaScriptの世界にできる
- JSXは階層構造になっている
不明白的词语。
驼峰命名法
在JavaScript中,应避免在className文本之间使用连字符等符号,并用大写字母进行写作。
参考来源网站
[拖拉非常先生的YouTube频道](https://m.youtube.com/watch?v=gLbTluYSb_U&list=PLX8Rsrpnn3IWPoM7-1YPDksRRkamRY25k&index=2&pp=iAQB)
JSX官方文档