티스토리 뷰
view에서 model 값을 가져오는데 사용되는 메소드로는
serializeData()와 templateHelpers()가 있다.
이 둘의 차이점을 확인해보자.
serializeData()
이 메소드는 보통 model이나 collection 데이터를
template에서 사용할 수 있는 형태로 변환할 때 사용된다.
serializeData는 기본적으로 단순히 model의 속성 값을 복사해준다.
var _ = require('underscore');
var Mn = require('backbone.marionette');
var myModel = new MyModel({foo: 'bar'});
var MyView = Mn.View.extend({
template: _.template('<h1>Hello, <%- foo %></h1>'),
serializeData: function() {
return this.model.toJSON(); // model 값을 json 형태로 변환
}
});
var myView = new MyView();
myView.render();
templateHelpers()
model 혹은 collection 자체의 값 이외에
커스텀하게 변환된 값 추가가 필요한 경우 사용한다.
serializeData()에서 반환된 json 타입의 데이터를 사용하여
모델에 포함되어 있지 않지만 템플릿에서
필요한 데이터가 있는 경우 사용하게 된다.
리터럴한 방법 혹은 함수를 사용해서 추가적으로 데이터를 만들어낸다.
var _ = require('underscore');
var Mn = require('backbone.marionette');
var MyView = Mn.View.extend({
template: _.template('<h1>Hello, <%- contextKey %></h1>'),
templateContext: {
return {
contextKey: this.getOption('contextKey') // model 값 이외의 값을 template 렌더 시 필요한 추가
}
}
});
var myView = new MyView();
myView.render();
'정리하기 > backbone&marionette' 카테고리의 다른 글
backbone.js (0) | 2018.05.14 |
---|---|
[marionette.js] region vs layout (0) | 2017.07.12 |
[marionette.js] 이벤트 관련 정리 (0) | 2017.05.11 |
- Total
- Today
- Yesterday
- git tag
- Typescript
- node
- angular
- common.js
- nodejs
- nextTick
- framework
- vue
- marionetts.js
- 함수
- js
- awe-some
- 외부모듈
- awesome-vue
- #가상머신
- vue.js
- 자바스크립트
- MarionetteJS
- 원하는것이있다면끝까지버텨라
- mocha.js
- 뉴욕
- backbone.js
- browserify
- eventbus
- AndroidContext
- javascript
- Android
- node.js
- vuex
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | ||
6 | 7 | 8 | 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 | 21 | 22 | 23 | 24 | 25 | 26 |
27 | 28 | 29 | 30 |