Browse Source

Moved to effect

Evan Bacon 4 years ago
parent
commit
ca0d43ddf2
1 changed files with 18 additions and 26 deletions
  1. 18
    26
      src/NativeSafeAreaView.web.tsx

+ 18
- 26
src/NativeSafeAreaView.web.tsx View File

@@ -22,34 +22,26 @@ export default function NativeSafeAreaView({
22 22
   style,
23 23
   onInsetsChange,
24 24
 }: NativeSafeAreaViewProps) {
25
-  const element = createContextElement();
26
-  document.body.appendChild(element);
27
-
28
-  const onEnd = () => {
29
-    const {
30
-      paddingTop,
31
-      paddingBottom,
32
-      paddingLeft,
33
-      paddingRight,
34
-    } = getComputedStyle(element);
25
+  React.useEffect(() => {
26
+    const element = createContextElement();
27
+    document.body.appendChild(element);
28
+    const onEnd = () => {
29
+      const {
30
+        paddingTop,
31
+        paddingBottom,
32
+        paddingLeft,
33
+        paddingRight,
34
+      } = getComputedStyle(element);
35 35
 
36
-    const insets = {
37
-      top: paddingTop ? parseInt(paddingTop, 10) : 0,
38
-      bottom: paddingBottom ? parseInt(paddingBottom, 10) : 0,
39
-      left: paddingLeft ? parseInt(paddingLeft, 10) : 0,
40
-      right: paddingRight ? parseInt(paddingRight, 10) : 0,
36
+      const insets = {
37
+        top: paddingTop ? parseInt(paddingTop, 10) : 0,
38
+        bottom: paddingBottom ? parseInt(paddingBottom, 10) : 0,
39
+        left: paddingLeft ? parseInt(paddingLeft, 10) : 0,
40
+        right: paddingRight ? parseInt(paddingRight, 10) : 0,
41
+      };
42
+      // @ts-ignore: missing properties
43
+      onInsetsChange({ nativeEvent: { insets } });
41 44
     };
42
-
43
-    console.log('onEnd');
44
-    // @ts-ignore: missing properties
45
-    onInsetsChange({ nativeEvent: { insets } });
46
-  };
47
-  React.useEffect(() => {
48
-    console.log(
49
-      'SUPPORTED_TRANSITION_EVENT',
50
-      SUPPORTED_TRANSITION_EVENT,
51
-      SUPPORTED_ENV,
52
-    );
53 45
     element.addEventListener(SUPPORTED_TRANSITION_EVENT, onEnd);
54 46
     onEnd();
55 47
     return () => {