Browse Source

Cache trait view

refactor-traits
Artur Arseniev 7 years ago
parent
commit
01c438a872
  1. 5
      src/trait_manager/model/Traits.js
  2. 31
      src/trait_manager/view/TraitView.js

5
src/trait_manager/model/Traits.js

@ -9,6 +9,11 @@ export default Backbone.Collection.extend({
initialize(coll, options = {}) { initialize(coll, options = {}) {
this.em = options.em || ''; this.em = options.em || '';
this.listenTo(this, 'add', this.handleAdd); this.listenTo(this, 'add', this.handleAdd);
this.listenTo(this, 'reset', this.handleReset);
},
handleReset(coll, { previousModels = [] } = {}) {
previousModels.forEach(model => model.trigger('remove'));
}, },
handleAdd(model) { handleAdd(model) {

31
src/trait_manager/view/TraitView.js

@ -37,20 +37,33 @@ export default Backbone.View.extend({
this.target = target; this.target = target;
const { ppfx } = this; const { ppfx } = this;
this.clsField = `${ppfx}field ${ppfx}field-${type}`; this.clsField = `${ppfx}field ${ppfx}field-${type}`;
model.off('change:value', this.onValueChange); [['change:value', this.onValueChange], ['remove', this.removeView]].forEach(
this.listenTo(model, 'change:value', this.onValueChange); ([event, clb]) => {
model.off(event, clb);
this.listenTo(model, event, clb);
}
);
model.view = this; model.view = this;
this.init(); this.init();
}, },
removeView() {
this.remove();
this.removed();
},
init() {}, init() {},
removed() {},
/** /**
* Fires when the input is changed * Fires when the input is changed
* @private * @private
*/ */
onChange() { onChange() {
this.model.set('value', this.getInputElem().value); const el = this.getInputElem();
if (el && !isUndefined(el.value)) {
this.model.set('value', el.value);
}
}, },
getValueForTarget() { getValueForTarget() {
@ -176,13 +189,15 @@ export default Backbone.View.extend({
* @private * @private
* */ * */
renderField() { renderField() {
const { $el, target, appendInput } = this; const { $el, target, appendInput, model } = this;
const inputOpts = { component: target }; const inputOpts = { component: target };
const inputs = $el.find('[data-input]'); const inputs = $el.find('[data-input]');
const el = inputs[inputs.length - 1]; const el = inputs[inputs.length - 1];
let tpl = this.createInput let tpl = model.el;
? this.createInput(inputOpts)
: this.getInputEl(); if (!tpl) {
tpl = this.createInput ? this.createInput(inputOpts) : this.getInputEl();
}
if (isString(tpl)) { if (isString(tpl)) {
el.innerHTML = tpl; el.innerHTML = tpl;
@ -191,6 +206,8 @@ export default Backbone.View.extend({
appendInput ? el.appendChild(tpl) : el.insertBefore(tpl, el.firstChild); appendInput ? el.appendChild(tpl) : el.insertBefore(tpl, el.firstChild);
this.elInput = tpl; this.elInput = tpl;
} }
model.el = this.elInput;
}, },
hasLabel() { hasLabel() {

Loading…
Cancel
Save