Error #1: Active ViewModel not found
This happened because vmLookup for the useViewModel hook is not provided, and the hook tries to look up the active view model using ActiveViewModelContext, which exists only when using the withViewModel HOC.
Explanation:
This usage of hook useViewModel
tsx
const model = useViewModel<YourVM>();Will use ActiveViewModelContext which exist only with usage withViewModel HOC.
This can also happen if you are trying to access an active ViewModel that does not exist in the current React render tree:
tsx
<Component1>
<ComponentAChild1>
<Component>
useViewModel<YourVM>()
</Component>
</ComponentAChild1>
<YourVMComponent /> - this provide active `ViewModel` (withViewModel)
</Component1>Potential solution
The potential solution to this problem is to pass the vmLookup to the useViewModel hook:
tsx
const model = useViewModel(YourVM);
const model = useViewModel("idofyourvm");Or use useViewModel<YourVM>() with the correct active ViewModel in the React render tree:
tsx
<YourVMComponent> - this provide active `ViewModel` (withViewModel)
<Component1>
<ComponentAChild1>
<Component>
useViewModel<YourVM>()
</Component>
</ComponentAChild1>
</Component1>
</YourVMComponent>