I started putting controller-like (e.g. cancelSelection()) functions in their own files (e.g. cancelSelection.js). These functions typically read and write to a variety of MobX stores. Stores are stored on the window and are abstracted behind a "getContext" function I invented. The React jsx calls these functions.
e.g.
// cancelSelection.js
import {getContext} from "./context"
export function cancelSelection() {
const { rootStore: { selectionStore, toolbarStore } } = getContext();
selectionStore.clear();
toolbarStore.setTool(CURSOR);
}
// App.jsx
import { cancelSelection } from "./cancelSelection"
<button onClick={() => cancelSelection()}>Cancel Selection</button>
Pros
- the test code can read them via the getContext() function.
- it's easy to find the orchestrator I need in VS Code with Cmd+P 'cancelSel...'
- keeps the jsx file smaller
Cons ...?
Via Active questions tagged javascript - Stack Overflow https://ift.tt/HEF1bm4
Comments
Post a Comment