5-1 页面传值提示 webview[movie-detail] does not exist at js/mui.min.js:6

Question

列表页面代码如下：

<li class="mui-table-view-cell" v-for="item in movies" @tap="open_detail(item)">
        ...
</li>

  
            //预加载电影详情页面
			var detailPage = mui.preload({
				id:'movie-detail',
				url:'./html/movie-detail.html'
			});
			
			
			
			//打开电影详情页面
			function open_detail(item){
				//触发详情页面的movieId事件
				mui.fire(detailPage,'movieId',{
					id:item.id
				});
				
				//打开详情页
				mui.openWindow({
					id:'movie-detail'
				});
			}			
			

详情页代码如下:

            mui.init();
			
			//添加 movieId 自定义事件
			window.addEventListener("movieId",function(event){
				
				//获取事件参数
				var id = event.detail.id;
				console.log(id);
				
			});

Answer 1

小贝666 2017-12-17 22:19:34

需要把页面的预加载放在mui.plusReady函数中才可以，因为这样写的话可能会预加载失败，在打开页面的时候使用预加载的页面id没有找到对应页面才会报这个错误。希望回答对您有帮助。

• 提问者 hezhou233 #1

  非常感谢就像您说的确实是这样

• 提问者 hezhou233 #2

  另外贴出官网最佳实践的网址供大家参考:
  http://ask.dcloud.net.cn/article/12575

Answer 2

提问者 hezhou233 2017-12-17 23:27:36

/**
 * 下面是我修改之后的部分代码,如果有相同问题的小伙伴可以参考指正
 */
mui.plusReady(function(){
        
    //其他代码
    .....

    //预加载电影详情页面
    var detailPage = mui.preload({
        id: 'movie-detail',
        url: './html/movie-detail.html'
    });
     
     
    return out = {
        detailPage : detailPage
    }
});
     
    
//打开电影详情页面
function open_detail(item){
    //触发详情页面的movieId事件
    mui.fire(out.detailPage,'movieId',{
        id:item.id
    });
    //打开详情页
    mui.openWindow({
        id:'movie-detail'
    });
}