diff options
| author | Shpuld Shpuldson <shp@cock.li> | 2020-06-18 16:47:37 +0300 |
|---|---|---|
| committer | Shpuld Shpuldson <shp@cock.li> | 2020-06-18 16:47:37 +0300 |
| commit | 8a9654b511268338d46f351da43a6bd85fbcb972 (patch) | |
| tree | 66d477ba0dc307e1074b5025933918da5ef31478 /src/services/resettable_async_component.js | |
| parent | 6d2befa452d6b42e47968f382a7ff62d4eb0d9b9 (diff) | |
| parent | ebf4321e645a34a40c00b0884546e9da86361952 (diff) | |
Merge branch 'develop' into features/favicons
Diffstat (limited to 'src/services/resettable_async_component.js')
| -rw-r--r-- | src/services/resettable_async_component.js | 32 |
1 files changed, 32 insertions, 0 deletions
diff --git a/src/services/resettable_async_component.js b/src/services/resettable_async_component.js new file mode 100644 index 00000000..517bbd88 --- /dev/null +++ b/src/services/resettable_async_component.js @@ -0,0 +1,32 @@ +import Vue from 'vue' + +/* By default async components don't have any way to recover, if component is + * failed, it is failed forever. This helper tries to remedy that by recreating + * async component when retry is requested (by user). You need to emit the + * `resetAsyncComponent` event from child to reset the component. Generally, + * this should be done from error component but could be done from loading or + * actual target component itself if needs to be. + */ +function getResettableAsyncComponent (asyncComponent, options) { + const asyncComponentFactory = () => () => ({ + component: asyncComponent(), + ...options + }) + + const observe = Vue.observable({ c: asyncComponentFactory() }) + + return { + functional: true, + render (createElement, { data, children }) { + // emit event resetAsyncComponent to reloading + data.on = {} + data.on.resetAsyncComponent = () => { + observe.c = asyncComponentFactory() + // parent.$forceUpdate() + } + return createElement(observe.c, data, children) + } + } +} + +export default getResettableAsyncComponent |
