React项目 cdn引用
程序员文章站
2022-05-24 18:06:03
...
React项目 cdn引用
怎么写一个一个cdn 引用的lib
怎么创建一个hook
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<script src="https://cdn.bootcdn.net/ajax/libs/react/16.13.1/umd/react.production.min.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/react-dom/16.13.1/umd/react-dom.production.min.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/babel-standalone/7.0.0-beta.3/babel.min.js"></script>
</head>
<body>
<div id="example"></div>
</body>
<script type="text/babel">
const compsButton = React.createElement(() => {
const { useEffect, useRef, useState } = window.React;
const [state, upState] = useState({ num: 1 });
const fun = {
update() {
state.num++;
upState({ ...state });
}
};
useEffect(() => {
console.log(123);
}, []);
return <button onClick={fun.update}>{state.num}</button>;
});
ReactDOM.render(<h1>{compsButton}</h1>, document.getElementById("example"));
</script>
</html>
- 为什么使用
createElement
很无奈 ，网上搜索了半天找不到，只有再次回到
官网，只有再次回归官网发现
为什么引用 三个js
- react.min.js - React 的核心库
- react-dom.min.js - 提供与 DOM 相关的功能
- babel.min.js - Babel 可以将 ES6 代码转为 ES5 代码，这样我们就能在目前不支持 ES6 浏览器上执行 React 代码。Babel 内嵌了对 JSX 的支持。通过将 Babel 和 babel-sublime 包（package）一同使用可以让源码的语法渲染上升到一个全新的
下一篇： 微人事-服务端菜单接口设计