JSX向JavaScript转换

60 阅读1分钟

一、JSX转换示例:

<div id="id" key="key">
  <span>1</span>
  <span>2</span>
</div>

转换成JavaScript:

"use strict";

React.createElement("div", {
  id: "id",
  key: "key"
}, 
React.createElement("span", null, "1"), 
React.createElement("span", null, "2"));

二、注意

jsx:
function Comp(){
	return <a>123</a>
}

<Comp id="id" key="key">
  <span>1</span>
  <span>2</span>
</Comp>

javaScript:

function Comp() {
  return React.createElement("a", null, "123");
}
React.createElement(Comp, {
  id: "id",
  key: "key"
}, 
React.createElement("span", null, "1"), 
React.createElement("span", null, "2"));

注意:Comp 首字母大写的时候,生成的是变量, 首字母小写的时候,生成的是字符串