扫一扫分享
react 的 Hooks api,但用于标准 Web 组件和lit-html或hyperHTML。
<html lang="en">
<my-counter></my-counter>
<script type="module">
import { html } from 'https://unpkg.com/lit-html/lit-html.js';
import { component, useState } from 'https://unpkg.com/haunted/haunted.js';
function Counter() {
const [count, setCount] = useState(0);
return html`
<div id="count">${count}</div>
<button type="button" @click=${() => setCount(count + 1)}>
Increment
</button>
`;
}
customElements.define('my-counter', component(Counter));
</script>
</html>
Haunted 支持与 React Hooks 相同的 API。希望通过这样做,您可以简单地通过在捆绑程序的配置中为包名称设置别名来重用 npm 上可用的钩子。
目前 Haunted 支持以下钩子:
useCallback
useContext
useController
useEffect
useLayoutEffect
useMemo
useReducer
useRef
useState
仅供个人学习参考/导航指引使用,具体请以第三方网站说明为准,本站不提供任何专业建议。如果地址失效或描述有误,请联系站长反馈~感谢您的理解与支持!
手机预览