Différences

Ci-dessous, les différences entre deux révisions de la page.

--- web:framework:react [2023/03/20 08:06] – jcheron
+++ web:framework:react [2024/04/10 09:40] (Version actuelle) – jcheron
@@ Ligne 171: / Ligne 171: @@
 }
 </sxh>
+==== Contexte ====
+<sxh ts>
+'use client';
+import React, {createContext, ReactNode, useContext, useState} from 'react';
+interface DemoContextType {
+    data: number;
+    setData: (d:number)=>void;
+}
+const DemoContext = createContext<DemoContextType | undefined>(undefined);
+export const demoProvider: React.FC<{ children: ReactNode }> = ({children}) => {
+    const [data, setData] = useState<number>(0);
+    return (
+        <DemoContext.Provider value={{data, setData}}>
+            {children}
+        </DemoContext.Provider>
+    );
+};
+export const useDemo = (): DemoContextType => {
+    const context = useContext(demoContext);
+    if (!context) {
+        throw new Error('usedemo must be used within a DemoProvider');
+    }
+    return context;
+};
+</sxh>
+===== Composants =====
+  * [[https://react-hook-form.com/|React-hook-form]]
+  * [[https://tanstack.com/query/v3/|React-query]]