Как остановить ошибку «Невозможно прочитать свойство« пол »нуля»? - PullRequest
Новая
       0

Как остановить ошибку «Невозможно прочитать свойство« пол »нуля»?

0 голосов
/ 02 апреля 2020

Это проблема, с которой я постоянно сталкиваюсь при использовании данных из базы данных в React

Невозможно прочитать свойство '...' из null '

До сих пор Я исправил это, обернув элементы в операторах if, остановив функцию от запуска, если свойство имеет значение null, но когда я делаю это. 

if (healthData !== null) {
    {
        healthData.gender === 'female' ?
            BMRset(655.1 + (9.563 * healthData.weight) + (1.850 * healthData.height) - (4.676 * healthData.age))
            :
            BMRset(88.2 + (13.362 * healthData.weight) + (4.799 * healthData.height) - (5.677 * healthData.age))
    }
}

Возвращает ошибку визуализации много раз. Я запутался, где я могу хранить эти расчеты? 

const [healthData, healthDataSet] = useState(null)
const [BMI, BMIset] = useState(null)
const [BMR, BMRset] = useState(null)

const [mealOne_box, mealOne_boxSet] = useState(false);
const [mealTwo_box, mealTwo_boxSet] = useState(false);
const [mealThree_box, mealThree_boxSet] = useState(false);
const [mealFour_box, mealFour_boxSet] = useState(false);

useEffect(() => {     
    const user = Authentication.auth().currentUser;
    {
        user !== null &&
            Authentication.firestore().collection('Health_data')
                .doc(user.uid)
                .get()
                .then(doc => {
                    healthDataSet(doc.data())
                }).catch(function (error) {
                    console.error("Error reading health", error);
                });
    }
}, []);  
    {
        healthData.gender === 'female' ?
            BMRset(655.1 + (9.563 * healthData.weight) + (1.850 * healthData.height) - (4.676 * healthData.age))
            :
            BMRset(88.2 + (13.362 * healthData.weight) + (4.799 * healthData.height) - (5.677 * healthData.age))
    }

1 Ответ

1 голос
/ 02 апреля 2020

Основная проблема c в том, что вы неправильно ожидаете асинхронного вызова c. Визуализация будет вызвана до того, как асин c будет завершен, поэтому вам нужно подготовиться к этому делу. Я бы предложил добавить состояние загрузки: 

import { ActivityIndicator } from 'react-native'

const MyComponent = () => {
  const [ loading, setLoading ] = useState(true)
  const [ healthData, setHealthData ] = useState(null)
  
  useEffect(() => {
    Authentication.firestore().collection('Health_data')
      .doc(user.uid)
      .get()
      .then(doc => {
        setHealthData(doc.data())
        setLoading(false)
      }).catch(function (error) {
        console.error("Error reading health", error);
      });
  }, [])
  
  if (loading || healthData == null) return <ActivityIndicator size="large" color="#0000ff" />
  return healthData.gender === 'female' ?
    <MyStuff /> :
    <MyOtherStuff />
}
...