3

我想创建一个默认配置文件，根据它创建我的视图。

我正在考虑类似的事情：

var Application = {};
Application.Config = {
   ViewerModule : {
     width    : '60%',
     height   : '60%',
     maxWidth : '99%',
     minWidth : '1%',
     iconSize : '24*24',
     defaultColor   : 'Green',
     selectedColor  : 'Orange',
     fontColor      : 'Black',
     viewerToolColor: 'White',
     defaultView    : 'Fit To Screen',
     Labels:{
            btnZoomIn     :'Zoom In',
            btnZoomOut    :'Zoom Out',
            btnRotateLeft :'Rotate Left',
            btnRotateRight:'Rotate Right',
            btnFitToScreen:'Fit to Screen',
            btnFullScreen :'Full Screen',
            btnSaveAs     :'Zoom In',
            btnExport     :'Zoom Out',
            btnPopOut     :'Rotate Left',
            btnEmail      :'Rotate Right',
            btnPdfConverter:'Fit to Screen',
            btnSetting    :'Settings'           
     }
   }
}

因此，当我在主干中创建视图时，我可以使用此配置值来定义我的主干视图的默认值。

我认为的一件事是将配置文件中的值保存到主干模型并使用该模型创建视图。

但是，我不确定这是否正确。

可以分享我如何实现它的想法或示例。

4

3 回答 3

2

您是否考虑过使用继承来解决这个问题？您可以使用BaseView具有上述属性的配置而不是配置 view options。这样，这些值可以在子视图的实现中被覆盖，或者在子视图的构建过程中被解析。

这是一个粗略的例子：

var BaseView = Backbone.View.extend({
    initialize: function() {
        this.options = {
            'Example': 'Foobar',
            'OverrideMe': 'Moo'
        };
    }
})

, ChildView = BaseView.extend({
    initialize: function() {
        this.options.Example = 'Something else';  
    }
})

, impl = new ChildView({'OverrideMe': 'Another thing'});

这是一个显示它工作的小提琴。

于 2013-08-27T13:08:28.253 回答
1

如果我理解你，我建议你使用Model defaults，在这里你可以看到简单的例子。或者您可以使用 json 对象之类的配置，但顺便说一下，您必须创建空模型并将配置 json 设置为模型（=新模型）

于 2013-08-27T13:03:08.397 回答
1

_.defaults如果你想为你的视图设置默认值，你可以将你的配置对象混合到你的视图原型中，如果你想_.extend强制使用这些值。

例如，

var Application = {};
Application.Config = {};
Application.Config.ViewerModule = {
    width: '60%',
    height: '60%'
};

var V = Backbone.View.extend({
    width: '50%'
});
_.defaults(V.prototype, Application.Config.ViewerModule);

var v = new V();
console.log(v.width, v.height);

还有一个演示http://jsfiddle.net/nikoshr/VX7SY/

于 2013-08-27T13:46:34.437 回答