preact框架的简单学习
编辑时间：2021-02-07
作者：金满斗
浏览量：2216
来源：原创
校长最近更新了sciter，例子里面用到了preact，当然跟着简单的学习下。
最开始的最简单例子
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<script type="module">
import { h, Component, render } from 'https://unpkg.com/preact?module';
// Create your app
const app = h('h1', null, '你好，世界!');
render(app, document.body);
</script>
</body>
</html>
哈哈，运行了就直接页面上生成了你好世界的字样，后面再去理解吧。
来第二个例子，哈哈，还是不懂，想搞上再说，好像有点用组件的意思。
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<script type="module">
import { h, Component, render } from 'https://unpkg.com/preact?module';
import htm from 'https://unpkg.com/htm?module';
// Initialize htm with Preact
const html = htm.bind(h);
function App (props) {
return html`<p>好用 ${props.name}!</h1>`;
}
render(html`<${App} name="聚宝盆记账易小程序" />`, document.body);
</script>
</body>
</html>
好用记账软件、聚宝盆记账易
热文排行
最近分享
拼多多优惠卷合集
