利用過濾器,對後台資料做預處理,將不符合要求的資料替換為使用者可以理解的資料,如將表示特定狀態的**替換為字串,或將英文替換為指定中文等
鑑於vue官方不建議繼續使用內建的過濾器機制,嘗試在獲取到服務端資料後手動一次性過濾,再將過濾後的資料新增到**上
針對每個需要執行過濾的資料項,建立專門的過濾器方法,全域性過濾器置於公共模組內,區域性過濾器置於元件內
在元件內建立入口過濾器方法,將服務端資料作為引數傳入,並在內部迭代;當執行到指定資料時,呼叫專門的過濾器方法
最終返回過濾完全的新資料,再執行後續操作
為了方便根據鍵名將資料直接匹配到**的列,因此資料的每一行使用物件表示,一行資料為整個**陣列的乙個元素
js 中獲取物件鍵(屬性名)陣列的方式
通過靜態方法配合 for...of 迴圈:
通過 for...in 迴圈:返回物件的所有屬性名,包括繼承而來的屬性
一張表解決:
js 中獲取物件屬性值的方式
// 通過屬性訪問操作符配合屬性名
let obj = ;
obj.name; // 或 obj['name'] ,屬性名預設為字串型別,除非顯示建立了 symbol 型別的屬性名
// 通過靜態方法
object.keys(obj)
js 中獲取物件鍵值對的方式
object.entries(obj):返回鍵值對陣列,每個鍵值對用陣列表示 [key,value]
問題描述:迭代屬性失敗,沒有獲取到屬性
問題分析:
一開始沒有使用正確的迭代物件屬性的方法,甚至用了陣列的 foreach 方法,導致獲取屬性名和值失敗
改進後通過for (const key in obj )
迴圈得到了屬性名,但屬性訪問方式有誤,導致新的值沒有設定到正確的屬性上:先是通過 obj.key 設定屬性值,導致過濾後的屬性值都在名為 'key' 的屬性中,而不是變數 key 實際表示的如 'name'、'age' 等屬性中
正確方式是通過 obj[key] 將 key 轉換成其所表示的字串屬性名,然後通過這個字串來訪問和設定指定的屬性問題總結:對於屬性中鍵和值的概念以及 js 中獲取鍵和值的技術理解不到位
問題描述:迭代和過濾成功,但賦值後返回的物件屬性中不是預期的值
問題分析:將每一行資料過濾後的返回值物件初始化為空物件,即 let newrow = {},然後將過濾後的值賦予該物件對應的屬性中,但存在問題:
如圖所示,用過濾器替換性別,返回值物件的屬性值仍然是原來的值,通過控制台輸出發現,外面看到的值和物件實際的屬性值不一樣
原先以為是不同方式初始化物件導致了差異的產生,改成將原始資料的深拷貝作為 newrow 的初始化;但問題其實非常基礎,是由於我在swich塊內沒有新增返回會終止語句,導致switch塊每次都執行到最後一條defaul語句,因而前面成功賦值的過濾值又被原始值覆蓋了;而由於swich語句的終止語句(break或return)在語法上並不是強制性的,因此編譯通過而不會報錯
問題總結:對於基本控制結構的理解不到位,程式設計習慣也有很大的改進空間;在**實現階段,需要先將基本的語法結構搭建好,之後再補充具體的資料操作和計算過程,避免被難以發現的語法錯誤干擾
本次的錯誤是源於對基礎概念理解不深,各個api運用不熟練,並沒有太好的解決方案,只能靠多看、多寫、多思考來加深理解和強化記憶
// 過濾服務端原始資料表
filterserverdata(serverdata) ,
// 過濾單條(一行)服務端資料中的所有元素
filterserverdataitem(row) ;
for (const [key, val] of object.entries(row))
return newrow;
},// 過濾服務端資料中的單個資料,相當於元件所用到的所有篩選器的入口
filterserverdatafield(key, val)
},
React Native 開發問題記錄
上述 如果不需要刪除陣列元素,則沒問題,但是如果需要刪除某個陣列元素時,就會出現問題 無論刪除第幾個物件,看到的結果都是刪除了最後乙個元素。而問題的原因在於遍歷陣列生成view時的key,動態刪除陣列元素後,render方法並不是真的全部重新建立view物件,而是找到刪除掉的key,把對應key的v...
webapp開發問題記錄
問題1 mui.plusready只能在html首次建立時會觸發且自動觸發,而在mui中的所有關於plus的api只能在plusready之後執行 問題2 關於獲取某乙個標籤中具有相同class的多個p標籤中的某乙個 通常我們為了簡便直接使用 實際上,該函式省略了乙個引數context,即 sele...
PHP開發之問題記錄
header content type text html charset utf 8 新增一行 解決亂碼 echo 中文 ip server remote addr echo ip arr array array push arr,tt arr key1 value 新增帶鍵值的資料 echo t...