广告设计图网站,做网站jsp和php,怎么查询网站所有关键词,微信小程序注册后怎么使用html引入react 效果代码注意 效果 分享react demo片段的时候#xff0c;如果是整个工程项目就有点太麻烦了#xff0c;打开速度慢#xff0c;文件多且没必要#xff0c;这个时候用html就很方便。 在html中能正常使用useState 和 useEffect 等hook。 代码
!DOCTYPE htm… html引入react 效果代码注意 效果 分享react demo片段的时候如果是整个工程项目就有点太麻烦了打开速度慢文件多且没必要这个时候用html就很方便。 在html中能正常使用useState 和 useEffect 等hook。 代码
!DOCTYPE html
html langen
headmeta charsetUTF-8meta nameviewport contentwidthdevice-width, initial-scale1.0titleReact App/title
/head
bodydiv idroot/divscript crossorigin srchttps://unpkg.com/babel/standalone/babel.min.js/scriptscript crossorigin srchttps://unpkg.com/react17/umd/react.production.min.js/scriptscript crossorigin srchttps://unpkg.com/react-dom17/umd/react-dom.production.min.js/scriptscript typetext/babelfunction App() {const [count, setCount] React.useState(0);React.useEffect(() {console.log(Component is mounted);return () {console.log(Component will unmount);};}, []); return (divh1Hello, React!/h1pThis is a simple React component./pp开始数字{count} /pbutton onClick{() setCount(count 1)}点击/button/div);};ReactDOM.render(App /, document.getElementById(root));/script
/body
/html
注意
这一段很重要typetext/babel 和 cdn 引用错误会导致失效。 script crossorigin srchttps://unpkg.com/babel/standalone/babel.min.js/scriptscript crossorigin srchttps://unpkg.com/react17/umd/react.production.min.js/scriptscript crossorigin srchttps://unpkg.com/react-dom17/umd/react-dom.production.min.js/scriptscript typetext/babel
