While implementing provide-inject in my personal project, I encountered an issue where the value returned by inject() was a RefImpl Object. This meant that I had to access the actual value using inject().value.value instead of just inject().value.
Here is how it was set up in App.vue:
setup() {
let userName = ref("Example");
provide("userName", userName);
}
And then in the login component:
var appUserName = inject("userName");
console.log(appUserName, appUserName.value, appUserName.value.value)
The console output can be seen here.
Even after changing the declaration of 'userName' from let to const in App.vue, the issue persisted:
setup() {
const userName = ref("Example");
provide("userName", userName);
}
I also verified that there was only one provide() for this parameter in the entire application, specifically in app.vue.