We run into a common problem using this library and vuetifyjs, and I think this library could be extended to offer a few basic components/functions to solve those issues with $scopedSlots. Bear with me for more detail.
When using a component such as v-data-table, we have a mandatory scoped slot. The problem with scope slots is that they're not part of the render of the current component, by current I mean the one we see in our SFC. Anything within a scoped slot is rendered as part of the render of the child component. So outside of the @Observer 'guard'.
My thought process was, maybe we could add a function to this library, that given a component wraps all $scopedSlots with a observer annotation? So that way, instead of using the v-data-table component from vuetify, I would use my data-table component which would be something akin to:
import { observerWithScopedSlots } from 'mobx-vue';
import VDataTable from 'vuetify/lib/components/VDataTable/VDataTable';
export default DataTable = observerWithScopedSlots(VDataTable);
We run into a common problem using this library and vuetifyjs, and I think this library could be extended to offer a few basic components/functions to solve those issues with
$scopedSlots. Bear with me for more detail.When using a component such as
v-data-table, we have a mandatory scoped slot. The problem with scope slots is that they're not part of the render of the current component, by current I mean the one we see in our SFC. Anything within a scoped slot is rendered as part of the render of the child component. So outside of the@Observer'guard'.My thought process was, maybe we could add a function to this library, that given a component wraps all
$scopedSlotswith a observer annotation? So that way, instead of using thev-data-tablecomponent from vuetify, I would use mydata-tablecomponent which would be something akin to:Thoughts?