$.vmodel.create({ selector: '.container', model: '--message', isautoload: true, method: function (){ var vs = this; this.autoload = ['init']; // 建立自訂方法,若需要自動被觸發,可將方法名稱寫入 autoload 的陣列 this.init = function (){ console.log('Hello World') } } });
this.autoload = ['init', 'click_button']; 或 this.autoload = function (){ // 做一些處理 return ['init', 'click_button']; }
$(".container").vmodel(".container", "--message", true, function (){ var vs = this; this.autoload = ['init']; this.yourfun = function (){ console.log('Hello World') } });
等同於內部的 this,例如呼叫內部的方法, this.callme() 等同於 vs.callme()。這麼做是因為 this 這個關鍵字在太多地方會使用。而一旦使用 vs 就能清楚明白,我們準備呼叫內部的屬性或方法。
取得跟位置的 $(selector)。
取得根指定的選擇器 selector。
告訴 vmodel 當前哪個方法的建構已經完成。
配合 $.vmodel.get() 第三個參數指定使用視覺化屬性的時候,需要透過該方法來輔助。通常使用在 function 的結尾。例如這裡我們先定義好模組,在使用 $.vmodel.get() 呼叫啟用。可參考這個範例:
$.vmodel.create({ selector: '.container', model: '--model', isautoload: false, method: function (){ var vs = this; this.autoload = ['say']; // 啟用後會自動讀取 say() this.say = function (){ console.log('Hello World') // 告訴模組這個方法建構完畢 vs.struct('say'); } // 做為完成後的呼叫 this.success = function (){ console.log('ByeBye') } } }); // 啟用模組,並在 "model" 建構完畢後會做一些事情 $.vmodel.get("model", true, function (storage){ storage.success(); // 等同 $.vmodel.get("model").success(); });
可在任何時候,啟用 vmodel 自動讀取(初始化或是建構的概念),或是呼叫 vmodel 模組內的某個方法。如果指定 listen ,那麼完成後會在根元素添加屬性 data-vmodel-history 作為紀錄。我們可以透過 $.vmodel.history() 取得。
$.vmodel.create({ selector: '.container', model: '--model', isautoload: false, // 不觸發 autoload method: function (){ var vs = this; this.autoload = ['init']; this.init = function (){ //.... } } }); $.vmodel.get("model", true); 或 $.vmodel.get("model", true, true); 或 $.vmodel.get("model", true, function (storage){ //... });
取得視覺化的屬性物件。如果找不到,會返回 false。務必將取得的倉儲對象,設定 $.vmodel.get() 第三個參數。
$.vmodel.get('my', true, true); var obj = $.vmodel.history('my');
監控多組倉儲,直到完成視覺化後,即刻觸發函式。若要使用該方法,務必啟用 $.vmodel.get() 第三個參數為 true 或 function,以及配合 vs.struct()。
$.vmodel.end(function (){ //... }) $.vmodel.end(['login', 'register'], function (){ //... })
刪除指定的倉儲。
$.vmodel.delete(); $.vmodel.delete('my');
取得當前的 vmodel 版本編號。
console.log( $.vmodel.version() ); // 輸出如 1.5.1