수색…
Iron Router를 통한 라우팅
Iron Router 설치
터미널에서 :
meteor add iron:router
기본 구성
Router.configure({
//Any template in your routes will render to the {{> yield}} you put inside your layout template
layoutTemplate: 'layout',
loadingTemplate: 'loading'
});
데이터없이 렌더링
//this is equal to home page
Router.route('/', function (){
this.render('home')
});
Router.route('/some-route', function () {
this.render('template-name');
});
데이터 및 매개 변수로 렌더링
Router.route('/items/:_id', function () {
this.render('itemPage', {
data: function() {
return Items.findOne({_id: this.params._id})
}
});
});
2 차 수익률로 렌더링
Router.route('/one-route/route', function() {
//template 'oneTemplate' has {{> yield 'secondary'}} in HTML
this.render('oneTemplate');
//this yields to the secondary place
this.render('anotherTemplate', {
to: 'secondary'
});
//note that you can write a route for '/one-route'
//then another for '/one-route/route' which will function exactly like above.
});
템플릿을 렌더링하기 전에 데이터 구독 및 대기
Router.route('/waiting-first', {
waitOn: function() {
//subscribes to a publication
//shows loading template until subscription is ready
return Meteor.subscribe('somePublication')
},
action: function() {
//render like above examples
}
});
여러 발행물에 가입하고 렌더링 템플릿 전에 데이터 대기
Router.route('/waiting-first', {
waitOn: function() {
//subscribes to a publication
//shows loading template until subscription is ready
return [Meteor.subscribe('somePublication1'),Meteor.subscribe('somePublication2')];
},
action: function() {
//render like above examples
}
});
아이언 라우터 가이드 : http://iron-meteor.github.io/iron-router/
FlowRouter로
FlowRouter 는 Iron Router에 비해 모듈 식입니다.
FlowRouter 설치
meteor add kadira:flow-router
템플릿 렌더링
특히 레이아웃 렌더링 패키지를 수동으로 추가하여 렌더링 엔진과 연결해야합니다.
- 블레이즈 용 블레이즈 레이아웃 :
meteor add kadira:blaze-layout
- React를 위한 반응 레이아웃 :
meteor add kadira:react-layout
그런 다음 동적 템플릿을 통해 렌더링 할 수 있습니다 (Blaze의 경우).
<template name="mainLayout">
{{> Template.dynamic template=area}}
</template>
FlowRouter.route('/blog/:postId', {
action: function (params) {
BlazeLayout.render("mainLayout", {
area: "blog"
});
}
});
매개 변수 및 / 또는 쿼리를 사용하여 템플릿 렌더링
매개 변수는 Iron Router와 같이 경로에 지정됩니다.
FlowRouter.route("/blog/:catId/:postId", {
name: "blogPostRoute",
action: function (params) {
//...
}
})
그러나 매개 변수는 하위 템플릿에 데이터 컨텍스트로 전달되지 않습니다. 대신 하위 템플릿은 반드시 읽어야합니다.
// url: /blog/travel/france?showcomments=yes
var catId = FlowRouter.getParam("catId"); // returns "travel"
var postId = FlowRouter.getParam("postId"); // returns "france"
var color = FlowRouter.getQueryParam("showcomments"); // returns "yes"
Modified text is an extract of the original Stack Overflow Documentation
아래 라이선스 CC BY-SA 3.0
와 제휴하지 않음 Stack Overflow