Page gone white overlay after back from third page

Hi @nolimits4web

This is a (multiple allowed):

• bug

• enhancement

• feature-discussion (RFC)

• Framework7 Version: 2.2.5

• Platform and Target: Android

• Live Link or JSFiddle: I’m afraid it would visible here,

What you did

In Page 2 (routes.js) :

{
    path: '/product/',
    url: './pages/produk.html',
	on: {
		pageInit: function () {
		 app.preloader.show("blue");
		 //var app = this.$app;
		  var kos;
		  //app.dialog.alert('Hello World!');
		  console.log(id_hewan)
		  app.request({
			  url: 'some url',
			  method: 'GET',
			  dataType: 'json',
			  cache:true,
			  //send "query" to server. Useful in case you generate response dynamically
			  success: function (data) {
				app.preloader.hide();
				for(var i=0;i < data.payload.length;i++){
					$$(".product_list ul").append('<li data-bahasa="'+ data.payload[i].product_name +'" data-id="'+ data.payload[i].product_id +'" class="com_language"><a class="item-link item-content">'+ data.payload[i].product_id +' - '+ data.payload[i].product_name +'</a></li>');
					/*$$(".product_list ul").append('<li class="item-content">'+
						 '<div class="item-inner">'+
							'<div class="item-title com_language" data-id="'+ data.payload[i].product_id +'">'+ data.payload[i].product_name +'</div>'+
						  '</div>'+
					'</li>');*/
				}
				
				$$(".com_language").on("click",function(){
					id_hewan = $$(this).data("id");
					app.router.navigate("/hewan/"+id_hewan+"/")
				});
				
				
			  }
			})
		}
	}
  }

In page 3 (routes.js) - get detailed of item :

{
    path: '/hewan/:id/',
    content: 
	'<div class="page">'+
        '<div class="navbar">'+
			'<div class="navbar-inner sliding">'+
			  '<div class="left">'+
				'<a href="#" class="link back">'+
				  '<i class="icon icon-back"></i>'+
				  '<span class="ios-only">Kembali</span>'+
				'</a>'+
			  '</div>'+
			  '<div class="title title_page">...</div>'+
			'</div>'+
		  '</div>'+
		'<div class="page-content">'+
          '<div class="block">'+
            '<img class="img_page" src="" />'+
            '<p class="desc_page">Menunggu teks...</p>'+
          '</div>'+
        '</div>'+
      '</div>',
	on: {
		pageInit: function () {
			//app.dialog.alert(localStorage.akadbaiq.hewan);
			app.preloader.show("blue");
			app.request({
				url: 'some url',
				method: 'GET',
				dataType: 'json',
				success: function (data) {
					app.preloader.hide();
					$$(".title_page").html(data.payload[0].product_id+" - "+data.payload[0].product_name);
					$$(".desc_page").html(data.payload[0].product_description);
					$$(".img_page").attr("src",data.payload[0].main_image).css("width","100%");
					//app.dialog.alert(data.nama);
					//app.dialog.alert(data.payload[0].product_name);
				},
				error: function (er){
					if(is_error){
						app.dialog.alert(data.status_msg);	
					}
				}
			});
		},
		pageAfterOut:function(){
			$$(document).trigger("click");		
		}
	}
  }

Expected Behavior

Get white page on my item list removed after back from detail page (page 3).

Actual Behavior

There is white screen overlay on my list, so my list were gone or invisible after back from detail page (page 3).

P.S. I searched & tried with add stackPages:true & animateWithJS:true on the app.js but it did nothing and also put cacheIgnore.

Please give me a detail help so I can work on it. Thank you & appreciate

[axis0093]

The same problem occurred to me. Follow the steps below 1.Using iOS theme and running on Android device. 2.Open a page (page A, page-content enable ptr and infinite scroll) with lis. Scroll down a little 3.Click a item of this list and navigate to page B 4.Swipe back from page B to page A 5.List items on page A will disappear, but if you click at the list position, the ‘onclick’ event will be fired

[YaoaY]

Temporay workaround:

 this.$f7.on('routeChanged', () => {
        this.$f7.dialog.preloader();
        setTimeout(() => {
          this.$f7.dialog.close();
        }, 1);
      });