[Vue warn]: Error in v-on handler: "TypeError: Object(...)(...).httpsCallable(...).then is not a function"

Question

I'm trying to call this firebase cloud functions from my Vue app

exports.sayHi = functions.https.onCall((data, context) =>{
  return "hi";
});

This is my action in the store

import {
  getFirebaseDB,
  getFirebaseFunctions,
} from "../../helpers/firebase/authUtils";

reserveApt() {
    getFirebaseFunctions()
      .httpsCallable("sayHi")
      .then((result) => {
        console.log(result);
      });
  },

and this is my helper functions in ../../helpers/firebase/authUtils:

import firebase from "firebase/app";
import "firebase/auth";
import "firebase/firestore";
import "firebase/functions";

/**
 * Initilize the backend
 * @param {*} config
 */
const initFirebaseBackend = (config) => {
  if (!_fireBaseBackend) {
    _fireBaseBackend = new FirebaseAuthBackend(config);
    _db = firebase.firestore();
    _functions = firebase.functions();
  }
  return _fireBaseBackend;
};


/**
 * Returns the firebase backend
 */
const getFirebaseBackend = () => {
  return _fireBaseBackend;
};


/**
 * returns firestore db
 */
const getFirebaseDB = () => {
  if (!_db) {
    _db = firebase.firestore();
  }
  return _db;
};


/**
 * returns firebase functions
 */
const getFirebaseFunctions = () => {
  if (!_functions) {
    _functions = firebase.functions();
  }
  return _functions;
};


export {
  initFirebaseBackend,
  getFirebaseBackend,
  getFirebaseDB,
  getFirebaseFunctions,
};

Firebase is properly initialized and all the other functions like auth and firestore work perfectly but when I call this I get this error:

[Vue warn]: Error in v-on handler: "TypeError: Object(...)(...).httpsCallable(...).then is not a function"

found in

---> <Properties> at src/views/pages/property/properties.vue
       <App> at src/App.vue
         <Root>

Thank you @AlanOmar I just figured it out. but I'm not sure why that is the solution. it seemed reasonable to call it directly. — Hawkar Shwany
– Hawkar Shwany, Commented Oct 17, 2021 at 6:58

Hawkar Shwany · Accepted Answer · 2021-10-17 06:56:54Z

1

So apparently the problem was in calling the function. I had to call it like this:

var reserve = getFirebaseFunctions().httpsCallable("sayHi");
    reserve().then((result) => {
      console.log(result);
    });

but I'm not sure why!!

answered Oct 17, 2021 at 6:56

Hawkar Shwany

3333 silver badges15 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

[Vue warn]: Error in v-on handler: "TypeError: Object(...)(...).httpsCallable(...).then is not a function"

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related