構建基於Javascript的移動CMS——產生部落格(三).重構，javascriptcms

構建基於Javascript的移動CMS——產生部落格(三).重構，javascriptcms

當前墨頎CMS的一些基礎功能設計已經接近尾聲了，在完成部落格的前兩部分之後，我們需要對此進行一個簡單的重構。為的是提取出其中的擷取Blog內容的邏輯，於是經過一番努力之後，終於有了點小成果。

墨頎CMS 重構

我們想要的結果，便是可以直接初始化及渲染，即如下的結果:

initialize: function(){        this.getBlog();    },    render: function(response){        var about = {            about:aboutCMS,            aboutcompany:urlConfig["aboutcompany"]        };        response.push(about);        this.$el.html(Mustache.to_html(blogPostsTemplate, response));    }

為的便是簡化其中的邏輯，將與View無關的部分提取出來，最後的結果便是都放在初始化裡，顯然我們需要一個render，只是暫時放在initialize應該就夠了。下面便是最後的結果:

initialize: function(){        var params='#content';        var about = {            about:aboutCMS,            aboutcompany:configure["aboutcompany"]        };        var blogView = new RenderBlog(params, '/1.json', blogPostsTemplate);        blogView.renderBlog(about);    }

我們只需要將id、url、template傳進去，便可以返回結果，再用getBlog部分傳進參數。再渲染結果，這樣我們就可以提取出兩個不同View裡面的相同的部分。

構建函數

於是，我們就需要構建一個函數RenderBlog，只需要將id,url,template等傳進去就可以了。

var RenderBlog = function (params, url, template) {    this.params = params;    this.url = url;    this.template = template;};

用Javascript的原型繼承就可以實現這樣的功能，雖然還不是很熟練，但是還是勉強用了上來。

RenderBlog.prototype.renderBlog = function(addInfo) {    var template = this.template;    var params = this.params;    var url = this.url;    var collection = new BlogPostModel;    collection.initialize(url);    collection.fetch({        success: function(collection, response){            if(addInfo !== undefined){                response.push(addInfo);            }            RenderBlog.prototype.render(params, template, response);        }    });};RenderBlog.prototype.render = function(params, template, response) {    $(params).html(Mustache.to_html(template, response));};

大致便是將原來的函數中的功能抽取出來，再調用自己的方法。於是就這樣可以繼續進行下一步了，只是暫時沒有一個明確的方向。

其他

CMS效果: 墨頎 CMS

QQ討論群: 344271543

項目: https://github.com/gmszone/moqi.mobi

C#的側邊欄技術答好了加分

左側的用自己來定義控制項也可以 但是第三方控制項會更漂亮 可以參考一下

你說的那種只是中間變化的 就是我們自己定義表單 完了設定它停靠到一個主表單上
我們做過這個
有問題可以發訊息給我
 
Extjs 3中的examplesjs有什用

彈出一個tip
配合examples.css使用效果更好