bugfix: pinia instance not created internally and thus missing from app if not explicitly included

This commit is contained in:
Braks
2021-07-09 22:18:46 +02:00
parent 6242b8e400
commit c8150a252f
3 changed files with 10 additions and 16 deletions
+3
View File
@@ -1,15 +1,18 @@
<template> <template>
<div id="app"> <div id="app">
<h1>Revue Flow</h1> <h1>Revue Flow</h1>
<Basic style="height: 75vh; background: #1a192b" />
</div> </div>
</template> </template>
<script lang="ts"> <script lang="ts">
import { defineComponent } from 'vue-demi'; import { defineComponent } from 'vue-demi';
import Basic from './Basic';
export default defineComponent({ export default defineComponent({
name: 'App', name: 'App',
components: { components: {
Basic
}, },
data() { data() {
return { return {
-2
View File
@@ -1,8 +1,6 @@
import { createApp } from 'vue-demi'; import { createApp } from 'vue-demi';
import App from './App.vue'; import App from './App.vue';
import { createPinia } from 'pinia';
const app = createApp(App); const app = createApp(App);
app.config.performance = true; app.config.performance = true;
app.use(createPinia());
app.mount('#app'); app.mount('#app');
+7 -14
View File
@@ -1,28 +1,21 @@
import { createPinia, defineStore, StoreDefinition } from 'pinia'; import { setActivePinia, createPinia, defineStore, StoreDefinition } from 'pinia';
import isEqual from 'fast-deep-equal'; import isEqual from 'fast-deep-equal';
import { Edge, Node, NodeDiffUpdate, ReactFlowState, RevueFlowActionsTree, XYPosition } from '../types'; import { Edge, Node, NodeDiffUpdate, ReactFlowState, RevueFlowActionsTree, XYPosition } from '../types';
import { import { getConnectedEdges, getNodesInside, getRectOfNodes, isEdge, isNode, parseEdge, parseNode } from '../utils/graph';
getConnectedEdges,
getNodesInside,
getRectOfNodes,
isEdge,
isNode,
parseEdge,
parseNode
} from '../utils/graph';
import { clampPosition, getDimensions } from '../utils'; import { clampPosition, getDimensions } from '../utils';
import { getHandleBounds } from '../components/Nodes/utils'; import { getHandleBounds } from '../components/Nodes/utils';
import { provide } from 'vue-demi';
type NextElements = { type NextElements = {
nextNodes: Node[]; nextNodes: Node[];
nextEdges: Edge[]; nextEdges: Edge[];
}; };
const pinia = createPinia();
setActivePinia(pinia);
export default function configureStore( export default function configureStore(
preloadedState: ReactFlowState preloadedState: ReactFlowState
): StoreDefinition<'revue-flow', ReactFlowState, any, RevueFlowActionsTree> { ): StoreDefinition<'revue-flow', ReactFlowState, any, RevueFlowActionsTree> {
provide(Symbol('pinia'), createPinia());
return defineStore({ return defineStore({
id: 'revue-flow', id: 'revue-flow',
state: () => preloadedState, state: () => preloadedState,
@@ -199,8 +192,8 @@ export default function configureStore(
const selectedElementsChanged = !isEqual(nextSelectedElements, this.selectedElements); const selectedElementsChanged = !isEqual(nextSelectedElements, this.selectedElements);
const selectedElementsUpdate = selectedElementsChanged const selectedElementsUpdate = selectedElementsChanged
? { ? {
selectedElements: nextSelectedElements.length > 0 ? nextSelectedElements : null selectedElements: nextSelectedElements.length > 0 ? nextSelectedElements : null
} }
: {}; : {};
this.userSelectionRect = nextUserSelectRect; this.userSelectionRect = nextUserSelectRect;