@@ -17,31 +17,60 @@ export default {
17
17
const params = {
18
18
...options ,
19
19
} ;
20
+
21
+ const component = ( props , ctx ) => {
22
+ const { $h, $onMounted, $el, $f7 } = ctx ;
23
+ $onMounted ( ( ) => {
24
+ const viewEl = $el . value . find ( '.view' ) ;
25
+ const view = $f7 . view . create ( viewEl , {
26
+ linksView : router . view . selector ,
27
+ ignoreOpenIn : true ,
28
+ loadInitialPage : false ,
29
+ } ) ;
30
+ view . router . navigate ( url , { props : options . props , reloadAll : true } ) ;
31
+ } ) ;
32
+ // eslint-disable-next-line
33
+ return ( ) => {
34
+ if ( options . openIn === 'popup' ) {
35
+ return $h `<div class="popup popup-router-open-in" data-url="${ url } "><div class="view"></div></div>` ;
36
+ }
37
+ if ( options . openIn === 'loginScreen' ) {
38
+ return $h `<div class="login-screen login-screen-router-open-in" data-url="${ url } "><div class="view"></div></div>` ;
39
+ }
40
+ if ( options . openIn === 'sheet' ) {
41
+ return $h `<div class="sheet-modal sheet-modal-router-open-in" data-url="${ url } "><div class="sheet-modal-inner"><div class="view"></div></div></div>` ;
42
+ }
43
+ if ( options . openIn === 'popover' ) {
44
+ return $h `<div class="popover popover-router-open-in" data-url="${ url } "><div class="popover-inner"><div class="view"></div></div></div>` ;
45
+ }
46
+ if ( options . openIn . indexOf ( 'panel' ) >= 0 ) {
47
+ const parts = options . openIn . split ( ':' ) ;
48
+ const side = parts [ 1 ] || 'left' ;
49
+ const effect = parts [ 2 ] || 'cover' ;
50
+
51
+ return $h `<div class="panel panel-router-open-in panel-${ side } panel-${ effect } " data-url="${ url } "><div class="view"></div></div>` ;
52
+ }
53
+ } ;
54
+ } ;
20
55
if ( options . openIn === 'popup' ) {
21
- params . content = `<div class="popup popup-router-open-in" data-url="${ url } "><div class="view view-init" data-links-view="${ router . view . selector } " data-url="${ url } " data-ignore-open-in="true"></div></div>` ;
22
56
navigateOptions . route . popup = params ;
23
57
}
24
58
if ( options . openIn === 'loginScreen' ) {
25
- params . content = `<div class="login-screen login-screen-router-open-in" data-url="${ url } "><div class="view view-init" data-links-view="${ router . view . selector } " data-url="${ url } " data-ignore-open-in="true"></div></div>` ;
26
59
navigateOptions . route . loginScreen = params ;
27
60
}
28
61
if ( options . openIn === 'sheet' ) {
29
- params . content = `<div class="sheet-modal sheet-modal-router-open-in" data-url="${ url } "><div class="sheet-modal-inner"><div class="view view-init" data-links-view="${ router . view . selector } " data-url="${ url } " data-ignore-open-in="true"></div></div></div>` ;
30
62
navigateOptions . route . sheet = params ;
31
63
}
32
64
if ( options . openIn === 'popover' ) {
33
65
params . targetEl = options . clickedEl || options . targetEl ;
34
- params . content = `<div class="popover popover-router-open-in" data-url="${ url } "><div class="popover-inner"><div class="view view-init" data-links-view="${ router . view . selector } " data-url="${ url } " data-ignore-open-in="true"></div></div></div>` ;
35
66
navigateOptions . route . popover = params ;
36
67
}
37
68
if ( options . openIn . indexOf ( 'panel' ) >= 0 ) {
38
- const parts = options . openIn . split ( ':' ) ;
39
- const side = parts [ 1 ] || 'left' ;
40
- const effect = parts [ 2 ] || 'cover' ;
41
69
params . targetEl = options . clickedEl || options . targetEl ;
42
- params . content = `<div class="panel panel-router-open-in panel-${ side } panel-${ effect } " data-url="${ url } "><div class="view view-init" data-links-view="${ router . view . selector } " data-url="${ url } " data-ignore-open-in="true"></div></div>` ;
43
70
navigateOptions . route . panel = params ;
44
71
}
72
+ params . component = component ;
73
+
45
74
return router . navigate ( navigateOptions ) ;
46
75
} ,
47
76
componentLoader ( component , componentUrl , options = { } , resolve , reject ) {
0 commit comments