[Vuejs]-How to access the value of a ref in Vue 3?

by

0👍

So what happened was two things:

  1. I didn’t return the ref inside an object in the composable. I did return recipe instead of return {recipe}
import $ from "jquery";
import { ref } from "vue";

const getPost = (id) => {
  const recipe = ref(null);
    
  $.get(`https://www.themealdb.com/api/json/v1/1/lookup.php?i=${id}`,
    function (data) {
    const [meals] = data.meals;
    recipe.value = meals;
    }
  );
    
  return { recipe };
};
    
export default getPost;
  1. Instead of onMount, I did a console.log with a watcher:
watch(recipe, ()=>{
  console.log(recipe.value);
})

Leave a comment