Overview
Client-side state management within the Tui framework refers to data that should persist, be updated or otherwise managed within a page that has completed its initial load. Many of Totara's new pages built on the Tui framework manage their state within a component tree, saving their data back to the server or refetching data as required. Major core Tui components that manage their own state (currently) include Uniform for aggregating Form components and Weka Editor.
...
- After triggering a mutation, you may be faced with the issue of the data in the UI not reflecting the data you have just submitted. At the moment, the recommended way of solving this is to use Apollo's
refetchQueries
option:refetchQueries: [{ query: getWorkspace, variables: { id: this.workspaceId } }]
You can also usereadQuery/writeQuery
to update the value of the query directly in the cache. - If you use
v-if="$apollo.loading"
to wait until a query is loaded to show your component, the content of thev-if
will be briefly unmounted while the query is refetching. In order to avoid this, we recommend doing av-if
on the query result instead, as that will stay as it is until the new value is available. See the JavaScript page for more info.