在JSX中嵌入用户输入
const title=response.potentiallyMaliciousInput;// This is safe:
const element={title}
元素是REACT最小构建块,且不可变(div,h1等)
将元素渲染到页面
constelement=Hello,world
;ReactDOM.render(element,document.getElementById('root'));
组件:接受单个“props”(代表属性)对象参数与数据并返回一个React元素(按钮,表单,对话框,屏幕等)
组件的复用
function formatDate(date) {
return date.toLocaleDateString();}
function Avatar(props) {
return ();}
function UserInfo(props) {
return ({props.user.name}
);}
function Comment(props) {
return ({props.text}{formatDate(props.date)});}
const comment = {
date: new Date(),
text: 'I hope you enjoy learning React!',
author: { name: 'Hello Kitty', avatarUrl: 'http://placekitten.com/g/64/64', },};
ReactDOM.render(,
document.getElementById('root')
);
REACT组件必须是纯的(不改变其输入,相同输入产出相同输出)
例:function sum(a,b){return a+b;}
;
网友评论