Iron Router 的单视图页面永久链接为空
Single view page permalink empty with Iron Router
我在 Iron-Router 中设置了两条路由:'home'(所有 post 的分页列表)和 'doc'(详细视图)。主页加载得很好,但只有在之前查看过主页的情况下才能加载详细信息视图。否则它将呈现为空——并且不能用作永久链接。
这将始终加载:
http://localhost:3000/
仅当 'home' 之前查看过时才会加载:
http://localhost:3000/doc/tZFawq8cgf43hZBaJ
路线:
Router.map(function() {
this.route('home', {
path: '/'
});
this.route('doc', {
path: '/doc/:_id',
data: function() {
return MyPix.findOne({_id: this.params._id});
}
});
});
文档模板:
<template name="doc">
<h1>{{this.name}}</h1>
<img src="{{ this.url store='OriginalRetinaPix' }}" width="{{ this.metadata.width }}" height="{{ this.metadata.height }}" />
</template>
publish/subscribe:
Meteor.publish('MyPix', function(cursor) {
Counts.publish(this, 'numberOfPosts', MyPix.find(), { noReady: true });
return MyPix.find({}, {sort: {uploadedAt: -1}, limit: 4, skip: cursor});
});
if(Meteor.isClient) {
Session.setDefault('docCursor', 0);
console.log('docCursor: ' + Session.get('docCursor'));
Meteor.autorun(function(){
Meteor.subscribe('MyPix', Session.get('docCursor'));
})
}
顺便说一句:GitHub
上的项目
您只订阅了所有文档的一个子集。如果您直接转到 /doc/tZFawq8cgf43hZBaJ
,则 ID 为 tZFawq8cgf43hZBaJ
的文档可能不是您在客户端收到的文档子集的一部分。
注意:如果这个答案是正确的,您应该能够直接转到 /doc/<id>
那些首先出现在主页上的文档(在第一页上,当会话变量 docCursor
是 0
).
在您的 "doc" 路线上,您应该使用 waitOn
以便在页面加载时准备好数据。在 Router.configure
中添加一个加载模板
我建议您升级到新的 iron:router
路由声明并添加 meteorhacks:subs-manager
以更好地缓存订阅。
这个示例应该适用于您的情况
var subs = new SubsManager();
Router.route('/doc/:_id', {
name: 'doc',
template: 'doc',
waitOn: function() {
return subs.subscribe('aPix', this.params._id);
},
data: function() {
return {
apix: MyPix.findOne({
_id: this.params._id
})
};
}
});
并在服务器端创建一个 publications.js
Meteor.publish('aPix', function(id) {
check(id, String);
return MyPix.find(id);
});
使用这个。
Router.map(function() {
this.route('home', {
path: '/'
});
this.route('doc', {
path: '/doc/:_id',
waitOn: function(){
return Meteor.subscribe('MyPix');
},
data: function() {
return MyPix.findOne({_id: this.params._id});
}
});
});
你的订阅也应该是这样的。
Meteor.publish('MyPix', function(cursor) {
//Counts.publish(this, 'numberOfPosts', MyPix.find(), { noReady: true });
return MyPix.find({});
});
另外补充,meteor add sacha:spin
,因为人多的时候,订阅会有一点延迟。
将此添加到每条路线。
loadingTemplate: "loading"
<template name="loading">
{{> spinner}}
</template>
Router.onBeforeAction("loading");
以防万一您在 'home'
上显示 100 多张图片并且有人进入并且连接速度较慢,他会认为页面加载为空或其他内容。
我在 Iron-Router 中设置了两条路由:'home'(所有 post 的分页列表)和 'doc'(详细视图)。主页加载得很好,但只有在之前查看过主页的情况下才能加载详细信息视图。否则它将呈现为空——并且不能用作永久链接。
这将始终加载: http://localhost:3000/
仅当 'home' 之前查看过时才会加载: http://localhost:3000/doc/tZFawq8cgf43hZBaJ
路线:
Router.map(function() {
this.route('home', {
path: '/'
});
this.route('doc', {
path: '/doc/:_id',
data: function() {
return MyPix.findOne({_id: this.params._id});
}
});
});
文档模板:
<template name="doc">
<h1>{{this.name}}</h1>
<img src="{{ this.url store='OriginalRetinaPix' }}" width="{{ this.metadata.width }}" height="{{ this.metadata.height }}" />
</template>
publish/subscribe:
Meteor.publish('MyPix', function(cursor) {
Counts.publish(this, 'numberOfPosts', MyPix.find(), { noReady: true });
return MyPix.find({}, {sort: {uploadedAt: -1}, limit: 4, skip: cursor});
});
if(Meteor.isClient) {
Session.setDefault('docCursor', 0);
console.log('docCursor: ' + Session.get('docCursor'));
Meteor.autorun(function(){
Meteor.subscribe('MyPix', Session.get('docCursor'));
})
}
顺便说一句:GitHub
上的项目您只订阅了所有文档的一个子集。如果您直接转到 /doc/tZFawq8cgf43hZBaJ
,则 ID 为 tZFawq8cgf43hZBaJ
的文档可能不是您在客户端收到的文档子集的一部分。
注意:如果这个答案是正确的,您应该能够直接转到 /doc/<id>
那些首先出现在主页上的文档(在第一页上,当会话变量 docCursor
是 0
).
在您的 "doc" 路线上,您应该使用 waitOn
以便在页面加载时准备好数据。在 Router.configure
中添加一个加载模板
我建议您升级到新的 iron:router
路由声明并添加 meteorhacks:subs-manager
以更好地缓存订阅。
这个示例应该适用于您的情况
var subs = new SubsManager();
Router.route('/doc/:_id', {
name: 'doc',
template: 'doc',
waitOn: function() {
return subs.subscribe('aPix', this.params._id);
},
data: function() {
return {
apix: MyPix.findOne({
_id: this.params._id
})
};
}
});
并在服务器端创建一个 publications.js
Meteor.publish('aPix', function(id) {
check(id, String);
return MyPix.find(id);
});
使用这个。
Router.map(function() {
this.route('home', {
path: '/'
});
this.route('doc', {
path: '/doc/:_id',
waitOn: function(){
return Meteor.subscribe('MyPix');
},
data: function() {
return MyPix.findOne({_id: this.params._id});
}
});
});
你的订阅也应该是这样的。
Meteor.publish('MyPix', function(cursor) {
//Counts.publish(this, 'numberOfPosts', MyPix.find(), { noReady: true });
return MyPix.find({});
});
另外补充,meteor add sacha:spin
,因为人多的时候,订阅会有一点延迟。
将此添加到每条路线。
loadingTemplate: "loading"
<template name="loading">
{{> spinner}}
</template>
Router.onBeforeAction("loading");
以防万一您在 'home'
上显示 100 多张图片并且有人进入并且连接速度较慢,他会认为页面加载为空或其他内容。