0
Kayıt Ol

React Native UseEffect Hata

7

●

116

  • 15-05-2023, 10:37:56
    #1
    Jouns
    Jouns 
    import React,{useEffect, useState} from 'react';
import {SafeAreaView, Text, View, Button} from 'react-native';


function App()  {
  const [goster,setGoster] = useState(true);

  
 function gizleme(){
  setGoster(!goster)
 }

  return (
    <SafeAreaView>
      <Button title='Arttır' onPress={gizleme} />
{goster && gizleGoster()}
    </SafeAreaView>
  );
}
export default App;

function gizleGoster(){
 useEffect(() => {
  console.log("Başladı bitti");
  // İşlevinizi buraya yerleştirin
  return () => {
    console.log("bitti");
    // Component kaldırıldığında yapılacak temizleme işlemleri
  };
}, []);
  return(
    <View>
    <Text>Ben İlhan Söylemez</Text>
    </View>
  );
}
    Error: Rendered fewer hooks than expected. This may be caused by an accidental early return statement. hatası alıyorum. ve {goster && gizleGoster()} bu kısımdaki gizlegoster() kısmını <gizlegoster/> olarak kullanamıyorum bu konuda yardımcı olur musunuz
  • 15-05-2023, 11:05:47
    #2
    LimonCreatif
    LimonCreatif
    Merhaba,

    Koda baktığımda birden çok hata var gibi duruyor hocam. Bu kodu siz mi yazdınız yoksa bir yerden mi kopyaladınız ?
  • 15-05-2023, 11:31:56
    #3
    Jouns
    Jouns
    LimonCreatif adlı üyeden alıntı: mesajı görüntüle
    Merhaba,

    Koda baktığımda birden çok hata var gibi duruyor hocam. Bu kodu siz mi yazdınız yoksa bir yerden mi kopyaladınız ?
    Nerede var hocam hataları yazabilir misiniz? Değişken isimlerini vs ben salladım ama genel yapıyı bir videodan aldım.
  • 15-05-2023, 11:56:22
    #4
    LimonCreatif
    LimonCreatif
    Jouns adlı üyeden alıntı: mesajı görüntüle
    Nerede var hocam hataları yazabilir misiniz? Değişken isimlerini vs ben salladım ama genel yapıyı bir videodan aldım.
    Uygun iseniz özel mesaj ile Meet linki yollayın detaylı anlatayım hocam.
  • 15-05-2023, 12:12:27
    #5
    madlypixel
    madlypixel
    exporttan sonra kod yazılmaz, fonksiyon içerisinde useeffect vb. state methodları kullanılmaz
  • 15-05-2023, 12:21:31
    #6
    Jouns
    Jouns
    madlypixel adlı üyeden alıntı: mesajı görüntüle
    exporttan sonra kod yazılmaz, fonksiyon içerisinde useeffect vb. state methodları kullanılmaz
    useeffect vb. state nerede kullanılmalı?
  • 15-05-2023, 12:21:43
    #7
    vido
    vido
    Üyeliği durduruldu
    Bu hata, React hooks'lerini düzgün kullanmadığınızı ve beklenen sayıda hooks çağrısını gerçekleştirmediğinizi gösterir. React hooks, bileşenin işlevsel bir bileşen olarak tanımlanmasına ve durumunun yönetilmesine olanak tanır. Bu durum, useState ve useEffect gibi hooks fonksiyonları aracılığıyla gerçekleştirilir.

    Hatanın nedeni, gizleGoster fonksiyonunun işlevsel bir bileşen olarak tanımlanmasına rağmen, hooks fonksiyonlarını doğru bir şekilde kullanmamanızdır. gizleGoster işlevindeki useEffect hooks fonksiyonu, hooks'u kullanırken dikkat edilmesi gereken kurallara uygun şekilde kullanılmamış gibi görünüyor.

    Bu şekilde, hooks fonksiyonlarını doğru bir şekilde kullanarak hata mesajını çözebilirsiniz.

    import React, { useState, useEffect } from 'react';
import { SafeAreaView, Button,View, Text  } from 'react-native';

function GizleGoster() {
  useEffect(() => {
    console.log("Başladı bitti");
    // İşlevinizi buraya yerleştirin
    return () => {
      console.log("bitti");
      // Component kaldırıldığında yapılacak temizleme işlemleri
    };
  }, []);

  return (
    <View>
      <Text>Ben İlhan Söylemez</Text>
    </View>
  );
}

function App() {
  const [goster, setGoster] = useState(true);

  function gizleme() {
    setGoster(!goster);
  }

  return (
    <SafeAreaView>
      <Button title='Arttır' onPress={gizleme} />
      {goster && <GizleGoster />}
    </SafeAreaView>
  );
}

export default App;
  • 15-05-2023, 12:37:52
    #8
    Jouns
    Jouns
    vido adlı üyeden alıntı: mesajı görüntüle
    Bu hata, React hooks'lerini düzgün kullanmadığınızı ve beklenen sayıda hooks çağrısını gerçekleştirmediğinizi gösterir. React hooks, bileşenin işlevsel bir bileşen olarak tanımlanmasına ve durumunun yönetilmesine olanak tanır. Bu durum, useState ve useEffect gibi hooks fonksiyonları aracılığıyla gerçekleştirilir.

    Hatanın nedeni, gizleGoster fonksiyonunun işlevsel bir bileşen olarak tanımlanmasına rağmen, hooks fonksiyonlarını doğru bir şekilde kullanmamanızdır. gizleGoster işlevindeki useEffect hooks fonksiyonu, hooks'u kullanırken dikkat edilmesi gereken kurallara uygun şekilde kullanılmamış gibi görünüyor.

    Bu şekilde, hooks fonksiyonlarını doğru bir şekilde kullanarak hata mesajını çözebilirsiniz.

    import React, { useState, useEffect } from 'react';
import { SafeAreaView, Button,View, Text  } from 'react-native';

function GizleGoster() {
  useEffect(() => {
    console.log("Başladı bitti");
    // İşlevinizi buraya yerleştirin
    return () => {
      console.log("bitti");
      // Component kaldırıldığında yapılacak temizleme işlemleri
    };
  }, []);

  return (
    <View>
      <Text>Ben İlhan Söylemez</Text>
    </View>
  );
}

function App() {
  const [goster, setGoster] = useState(true);

  function gizleme() {
    setGoster(!goster);
  }

  return (
    <SafeAreaView>
      <Button title='Arttır' onPress={gizleme} />
      {goster && <GizleGoster />}
    </SafeAreaView>
  );
}

export default App;
    Hocam sadece benim dıştaki fonksiyon isminin baş harfini büyük yapınca çalışıyor