haunted

مسكون ؟ ؟

React's Hooks API ولكن لمكونات الويب القياسية وlit-html أو HyperHTML.

اقرأ المستندات

 < html lang =" en " >
  < my-counter > </ my-counter >

  < script type =" module " >
    import { html } from 'https://unpkg.com/lit?module' ;
    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. الأمل هو أنه من خلال القيام بذلك، يمكنك إعادة استخدام الخطافات المتوفرة على npm ببساطة عن طريق تسمية أسماء الحزم في تكوين الحزمة الخاصة بك.

يدعم Haunted حاليًا الخطافات التالية:

• useCallback
• useContext
• useController
• useEffect
• useLayoutEffect
• useMemo
• useReducer
• استخدامالمرجع
• useState

التوقيعات الوظيفية

 // Or another renderer, see Guides
type Renderer = ( element : Element ) => TemplateResult ;

interface Options {
  baseElement : HTMLElement ;
  observedAttributes : string [ ] ;
  useShadowDOM : boolean
}

declare function component (
  renderer : Renderer ,
  options : Options
) : Element ;

declare function component < BaseElement = HTMLElement > (
  renderer : Renderer ,
  baseElement : BaseElement ,
  options : Options
) : Element

declare function virtual ( renderer : Renderer ) : Directive 

رخصة

بسد-2-بند