The hook is not working properly
``` javascript
import {value, computed, watch, onMounted, onDestroyed, onCreated, state, createComponent} from 'vue-function-api';
import Vue from 'vue';
const MessageComponent = {
setup() {
const msg = value('hello');
onMounted(() => console.log('hello'));
return {
msg
};
}
};
export default createComponent({
setup() {
const Message = Vue.extend(MessageComponent);
const message = new Message();
onCreated(() => console.log('create message'));
return {};
}
});
````
Error: [vue-function-api] "onCreated" get called outside of "setup()"
Manually creating a component instance like that in setup will break this plugin, correct.
In a way it's expected behaviour, as calling new Message() made this component the currentInstance, so now all hooks expect to be called within this instance's setup function.
The proper way to handle that would probably be to create that instance within a hook like oncreated(), not withinsetup()`, but I'm not sure if that works for your situation.
So can you provide a bit of context for the use case that you have for this?
Most helpful comment
Manually creating a component instance like that in setup will break this plugin, correct.
In a way it's expected behaviour, as calling
new Message()made this component thecurrentInstance, so now all hooks expect to be called within this instance's setup function.The proper way to handle that would probably be to create that instance within a hook like
oncreated(), not withinsetup()`, but I'm not sure if that works for your situation.So can you provide a bit of context for the use case that you have for this?