react 学习整理
如何使用引号传递字符串
常见的
<imgclassName = 'avater'src = 'http://...'alt = 'gregorio y '
/>或者声明变量来保存
export default function XXX(){
const avator = 'avator'
const description = 'gergorio y'
return (<image className = 'XXX'src = {avator}alt = {alt}
/>);
}
在jsx的大括号内引用javascript
在上面事例中className 实际上就是可以引用javascript
在jsx的大括号内调用javascript
在 JSX 中,只能在以下两种场景中使用大括号:
用作 JSX 标签内的文本:
{name}'s To Do List
是有效的,但是 <{tag}>Gregorio Y. Zara’s To Do List</{tag}> 无效。用作紧跟在 = 符号后的 属性:src={avatar} 会读取 avatar 变量,但是 src=“{avatar}” 只会传一个字符串 {avatar}。
在jsx的大括号内使用javascript
在 JSX 中,只能在以下两种场景中使用大括号:
用作 JSX 标签内的文本:
{name}'s To Do List
是有效的,但是 <{tag}>Gregorio Y. Zara’s To Do List</{tag}> 无效。用作紧跟在 = 符号后的 属性:src={avatar} 会读取 avatar 变量,但是 src=“{avatar}” 只会传一个字符串 {avatar}。
如:
<ul style={ { backgroundColor: 'black', color: 'pink' } }>