好吧,我不跟網上的人一樣 ,之貼出** 也沒有資料結構,我很煩這樣的 所以我先貼一下資料結構
下圖是沒有修改的,直接從後台請求回的資料
下圖是經過修改後的資料
在block(因為後面我還需要多個view來用 ,所以就直接加了乙個block,如果你就乙個view就不用寫了)裡面寫好你需要渲染的資料列表,其中想要使用字母索引的城市選擇,我在這裡推薦
上面說完了,下面就是寫邏輯了,我用的actions, reducers,types 三個檔案來返回資料的,返回的資料就是第一張圖里的cities。
因為要字母索引,所以在onload函式裡重新new了乙個新的陣列,引用laodash裡的foreach函式生成27個字母索引陣列在words裡
同樣的 。我要遍歷我得到的陣列 item.pinyin.substring(0, 1).touppercase() 是獲取我得到的陣列裡的拼音裡第乙個字母把他轉變為大寫字母
把符合的相同型別push到字母索引裡
就如下圖所示
然後把所得到的陣列迴圈出來就好了 剩下的就不難了
我把最後的渲染圖拿出來吧
在這裡 我要特別說明一下 ,我在這上面踩了很多坑 首先,iviewui確實不錯,但是當初設計的時候是按照全域性來設計的,也就是說,它會和你在這個頁面上再加的view 「斷流」
這個超級噁心。但是,開發者還是給我們留了一點點後路,在這裡我就提一下。
萬幸的是 開發者留下了乙個介面。externalclasses: ['i-class'] 可是救命的東西
它預留了乙個介面,平常在外面定義的普通class是不會對這個組建的樣式起作用的。這個的作用是讓普通的class也起作用
用法就是你定義好的class 在這個元件上要 i-class =「your classname」這樣就起作用了。
這個版本是上幾個版本了 寫的不咋地,如果有空我會把我優化好的demo發一下
先將就這麼看吧。
js pinyin包實現城市按首字母排序
後台從介面請求回來的城市相關的資料只有城市名稱,沒有排序,鋪頁面的時候要排序就很麻煩 這個包的名字叫js pinyin。npm i js pinyin 安裝拼音庫 import pyjs from js pinyin 引入依賴包 pyjs.getfullchars item.name 獲取字串全部拼...
按字母順序排序,小寫字母在前
class mycompare implements comparator else if arg0.compareto arg1 32 else if arg0.compareto arg1 25 else if math.abs arg0.compareto arg1 32 else if ma...
實現按指定字母序進行排序
給定 n 個字串 abc dca add ae 最終排序結果為 abc ae add dca include include include include char need arr abcdefghijklmnopqrstuvwxyz typedef char words words worda...