学习笔记《JSX》
2016-11-13 本文已影响4人
马文Marvin
JSX 可以被视为一种 JS 的模板语言,形如:
const element = <h1>Hello, world!</h1>;
使用引号来表示 JS 代码:
const element = (
<h1>
Hello, {formatName(user)}!
</h1>
);
如果是多行的话,可以加一个括号:
const element = (
<div>
<h1>Hello!</h1>
<h2>Good to see you here.</h2>
</div>
);
在 React 中三种等价的创建形式:
const element = (
<h1 className="greeting">
Hello, world!
</h1>
);
const element = React.createElement(
'h1',
{className: 'greeting'},
'Hello, world!'
);
// Note: this structure is simplified
const element = {
type: 'h1',
props: {
className: 'greeting',
children: 'Hello, world'
}
};
就是这些,是不是非常简单:)