Не могу получить данные о нагрузке от FireBase, используя реаги и редукции

Question

Я пытаюсь получить данные из firebase, но кажется, что эта функция никогда не выполняется.

В моем реагирующем компоненте у меня есть componentdidmount, так что в начале он отправляет действие и получает данные.

Я получил ссылку на базу данных, импортирую ее и затем в своем действии thunk я пытаюсь сделать это:

listsRef.on("value", snapshot => {
    dispatch(receiveLists(snapshot.val()))

  })

Но метод listsRef.on никогда не выполняется, потому что если я добавьте в него console.log, он никогда не будет регистрироваться

listsRef является правильной ссылкой, как будто я регистрирую его, я могу видеть ссылку на объект

Из того, что я прочитал, это путь получить или получить данные, не так ли?

Есть идеи, в чем может быть проблема? Thx.

Полное действие:

export const handleInitialData = () => async dispatch => {
  listsRef.on("value", snapshot => {
    dispatch(receiveLists(snapshot.val()))
  })
}

Моя настройка базы:

var firebaseConfig = {
  apiKey: "xxxx",
  authDomain: "xxx",
  databaseURL: "xxx",
  projectId: "xxx",
  storageBucket: "xxx",
  messagingSenderId: "xxx",
  appId: "xxx",
  measurementId: "xxx"
};

// Initialize Firebase
firebase.initializeApp(firebaseConfig);

firebase.analytics();

const databaseRef = firebase.database().ref();
export const listsRef = databaseRef.child("lists")

Мой компонент реакции:

const List = ({dispatch, addList, lists}) => {

  useEffect(() => {
    dispatch(handleInitialData())
  },[dispatch])


...more code

}


const mapStateToProps = ({lists}) => {
  return {
    lists,
  }
}



export default connect(mapStateToProps)(List);