Provide own renderWhenVisible function since manually creating an object view (#7281)

inspector view needs renderWhenVisible function
This commit is contained in:
David Tsay 2023-12-08 09:33:49 -08:00 committed by GitHub
parent 93e5219917
commit 9ed8d4f5a5
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -35,6 +35,7 @@
<script>
import mount from 'utils/mount';
import VisibilityObserver from '../../utils/visibility/VisibilityObserver';
import Plot from '../plot/PlotView.vue';
import TelemetryFrame from './TelemetryFrame.vue';
@ -89,8 +90,9 @@ export default {
this.clearPlots();
this.unregisterTimeContextList = [];
this.elementsList = [];
this.componentsList = [];
this.elementsList = [];
this.visibilityObservers = [];
this.telemetryKeys.forEach(async (telemetryKey) => {
const plotObject = await this.openmct.objects.get(telemetryKey);
@ -109,7 +111,10 @@ export default {
return this.openmct.time.addIndependentContext(keyString, this.bounds);
},
renderPlot(plotObject) {
const { vNode, destroy } = mount(
const wrapper = document.createElement('div');
const visibilityObserver = new VisibilityObserver(wrapper);
const { destroy } = mount(
{
components: {
TelemetryFrame,
@ -117,7 +122,8 @@ export default {
},
provide: {
openmct: this.openmct,
path: [plotObject]
path: [plotObject],
renderWhenVisible: visibilityObserver.renderWhenVisible
},
data() {
return {
@ -133,13 +139,15 @@ export default {
</TelemetryFrame>`
},
{
app: this.openmct.app
app: this.openmct.app,
element: wrapper
}
);
this.componentsList.push(destroy);
this.elementsList.push(vNode.el);
this.$refs.numericDataView.append(vNode.el);
this.elementsList.push(wrapper);
this.visibilityObservers.push(visibilityObserver);
this.$refs.numericDataView.append(wrapper);
},
clearPlots() {
if (this.componentsList?.length) {
@ -152,6 +160,11 @@ export default {
delete this.elementsList;
}
if (this.visibilityObservers?.length) {
this.visibilityObservers.forEach((visibilityObserver) => visibilityObserver.destroy());
delete this.visibilityObservers;
}
if (this.plotObjects?.length) {
this.plotObjects = [];
}