ExtJS的View部分的基本操作

2021-09-22 13:26:22 字數 2711 閱讀 2120

先上**

我們在view的viewcontroller檔案中進行測試,純屬為了方便。

ext.define('ruku.view.main.maincontroller', ,

onconfirm: function (choice)

},init: function()

});

1--init方法,如下**所示,我們使用了init方法這是extjs種viewcontroller的乙個方法,定義如下

這個方法通常的格式如下:

我們的目的就是在init中,寫一些extjs的**,可以在網頁被載入的第一時間,執行這些**。

2--js變數的長度

var v1 = ***;

的方式定義乙個js變數,然後使用v1.length可以獲取這個變數的長度。

3--上述**的執行結果:

上述過程中最有價值的就是獲取component的名字

上述語句對應的ui的**是:它成功的獲取了ruku.view.main.main

ext.define('ruku.view.main.main', 

5---localstorage

這個英文單詞的含義,很豐富,在奎克系統中它的出現是這樣的:

/*** 專案永久儲存資訊

*/ alternateclassname : 'local', // 設定別名是為了方便呼叫,這樣直接cfg.***就能獲取到變數。

statics : key

* @param {} obj

*/set : function(key, obj)

最初以為這裡的localstorage是不知道在哪個檔案,什麼位置定義的extjs的變數,查詢官網,如下:

其實不是這樣,localstorage首先不是前端層面的概念,也就是說,它不是**層面的概念

它是瀏覽器上的概念

也就是說,localstorage即使沒有extjs也可以使用

我測試了一下:

經測試,ie6瀏覽器,無法顯示第二個alert的資訊;

但是firefox等瀏覽器的新版本,都可以。

下面去mozilla的官網看看

這個**有更加詳實的介紹

可以使用chrome瀏覽器檢視localstorage

對照奎克系統,看看local storage是怎樣工作的

原本平靜的登入介面

登入以後看到了local storage中的資料

userinfo這個變數中的內容如下:

那麼在**上,上述登入過程是怎樣使用local storage的呢?

上述三個檔案,是**剛一訪問的時候,彈出的主介面main以及login介面

我們看到login.js頁面配有viewcontroller.js檔案

這個檔案的名字是logincontroller.js

輸入使用者名稱密碼後,js**會使用eu.rs()方法,其核心是ext.ajax.request();方法

向乙個url傳送乙個ajax請求,返回來的結果被callback方法進行解析;

url的request的響應過程是spring mvc來處理的,返回值是json

過程略過

success登入以後,我們通常的做法是將使用者的資訊存放在session中,這樣貫穿整個**,都可以隨時獲取使用者資訊,從而知道給這個使用者什麼樣的許可權

但是上圖**,將使用者資訊儲存在local中,這是什麼呢?

儲存使用者資訊的**:

local.set("userinfo", userinfo);

local.set("islogin", true);

關於部分基本控制項的使用

android id id id值 設定id值 android text 定義顯示文字 android layout width wrap content 元件寬度為文字寬度 android layout height wrap content 元件寬度為文字高度 textview 文字顯示框 an...

ExtJS5 1學習筆記 Grid元件的基本用法

ext中的grid元件是乙個非常有用的元件,它類似於html中的 但是功能比普通的 多得多,如下圖所示 下面記錄grid元件的基本用法 上面的 在瀏覽器中訪問的效果如下圖 自定義渲染函式 自定義渲染函式可以實現對列的表現形式做不同的處理,如給性別列中male顯示為男,female顯示為女,且用不同的...

View的事件體系之View的位置引數

如圖所示,為view的位置座標與父容器的關係圖,此圖 於老任的 android開發藝術探索 這本書,感興趣的同學可以去看下,以此我們來簡單介紹下view的位置引數的相關知識。首先是4個基本屬性top left right bottom 如圖,這幾個屬性,都是view相對于父容器的資訊 top 左上角...