728x90 반응형 react3 Canvas Bubble Effect 기록(react + typescript) Mouse Bubble Effect Code 기록 import React, {useEffect, useRef} from 'react'; interface BubbleMouseType { x?: number, y?: number, radius: number } export default function Bubble(){ const canvasRef = useRef(null); const mouse: BubbleMouseType = { x: undefined, y: undefined, radius: 150 } let particlesArray: any = []; let adjustX = 0; let adjustY = 0; useEffect(() => { const canvas = canvasRef?.curr.. 2022. 12. 7. Canvas Crash Effect 기록(react + typescript) Mouse Crash Effect Code 기록 import React, {useEffect, useRef} from 'react'; interface mouseType { x?: number, y?: number } export default function Crash(){ const canvasRef = useRef(null); const mouse: mouseType = { x: undefined, y: undefined } const particlesArray: any = []; let hue:number = 0; useEffect(() => { const canvas = canvasRef?.current; if (canvas) { let ctx = canvas.getContext('2d'); c.. 2022. 12. 7. React Native WebView postMessage로 네이티브, 웹 데이터 전달 React Native npm install react-native-webview import React, { useRef } from "react"; import {WebView} from 'react-native-webview'; import { Button, SafeAreaView } from "react-native"; const App = () => { const url = "URL" let webRef = useRef(null); /** 웹뷰 ref */ const handleSetRef = _ref => { webRef = _ref; }; /* native -> web */ const native_to_web = () => { console.log(webRef.postMessage("전송 데.. 2022. 3. 29. 이전 1 다음 728x90 반응형