smalljs$mol搜尋⌘ K文件遊樂場比較生態系統關於ZH_HK
疑難排解Getting Started介紹心智模型快速開始從 TypeScript 到 view.tree專案結構工具鏈Essentials安裝視圖狀態與響應式路由渲染測試部署疑難排解Data資料獲取資料模式Giper BazaMore展示來自 React、Vue 和 Svelte食譜Advanced外掛模組元資料離線幽靈視圖About常見問題團隊發布API$mol_button_major$mol_button_minor$mol_string$mol_number$mol_text$mol_paragraph$mol_list$mol_row$mol_link$mol_check$mol_switch$mol_select$mol_scroll$mol_page$mol_pick

疑難排解

本頁每一條的形狀都一樣:建置是綠的,稽核是乾淨的,主控台一聲不吭,而畫面要麼空着,要麼不是你想要的樣子。編譯器看不見這些錯誤,因為每一個都是合法的程式,只不過它描述的是另一個元件。找到那條讀起來像你眼前現象的標題,下面就是原因和修法。

我覆寫了屬性卻沒有任何效果,也不報錯

view.tree 裏的名字和類別裏方法的名字不一致,最常見的是大小寫:樹裏寫 exchange_form,類別裏寫 exchangeForm。這是兩個屬性。類別裏的那個永遠不會被呼叫,樹裏的那個保持預設值,而且沒有任何東西會把這件事報出來。名字處處都是 snake_case,而且必須逐字母一致。改過 .view.ts 之後,請檢查每一處覆寫是否仍然對應一個存在的屬性;樹旁邊產生的 -view.tree/*.view.tree.d.ts 就是用來比對的清單。

輸入框要設定 placeholder、停用狀態或輸入類型

這些都是 $mol_string 的屬性:hint 是 placeholder,enabled 是停用狀態,type 是輸入類型。在用到這個輸入框的地方設定它們:1<= Password $mol_string2 hint \Password3 type \password4 enabled <= can_edit true5 value? <=> password? \任何其他元件的任何其他屬性都用同樣的方式找到:打開它的 .view.tree,正如 如何閱讀原始碼所示。attr * 是給元件本身沒有建模的真實 DOM 屬性用的,它自己也有個坑:一個不以 ^ 開頭的區塊會整個替換掉基底類別的屬性字典,於是這樣寫的 $mol_button 會丟掉 disabledroletabindex。用 ^ 開頭來繼承,然後再加你自己的鍵:1attr *2 ^3 data_kind \primary

一個詞被拆成一個個字母渲染出來

在期待清單的地方傳了一個字串,於是字串被逐字元攤開了。字串以 \ 開頭,清單以 / 開頭。最常見的情形是 sub,它是一個清單:1sub / <= label \Hello

畫面是空的,測試卻是綠的

有一處覆寫從 .view.ts 裏掉了。樹給每個屬性都配了預設值,所以當類別不再重新定義 rows() 時,TypeScript 很滿意,而清單渲染出來是空的。只檢查模型的測試仍然是綠的,因為模型本身沒問題。畫面依賴的每一處覆寫,都該寫一個讀取用戶所見之物的測試:rows()sub()、子視圖的 title(),或者 DOM。 測試 兩種都講了。

資料永遠載入不出來,元件卡在載入狀態

某個 @ $mol_mem 方法把 promise 當成值回傳了:fetch( uri ).then( ... )、一個 async 方法,或者 $mol_wire_async( this ).load() 的結果。單元裏的 promise 對所有人來說都讀作「仍在計算」,而當它解析時單元重新計算,又產出一個新的 promise。網絡是通的;視圖卻永遠等不到結果。正確的形態是同步的:在單元裏呼叫 this.$.$mol_fetch.json( uri ) 並回傳解析後的值。纖程會暫停直到回應到手,然後重跑這個單元,於是 promise 根本不會出現在你的程式碼裏。如果非同步的活兒必須發生在別處,把它的結果放進一個單獨的狀態單元,讓副作用回傳一個旗標或一個鍵,永遠不要回傳 promise。第二個成因是被吞掉的錯誤:單元內部的 try/catch 把暫停連同真正的失敗一起捕捉了。請把任何屬於 Promise 的東西重新拋出,或者改用 $mol_fail_catch,它會替你做這個判斷。

循環訂閱

某個 @ $mol_mem 方法寫了另一個單元,或者做了副作用,結果讓它讀過的東西失效了。計算只讀取和回傳;寫入、網絡、計時器和 DOM 屬於 @ $mol_action 處理器。同一條訊息的另一個來源,是對某個子節點的 <=> 繫結,加上類別裏一個轉發給同一個子節點的方法,下一條就說這個。

Maximum call stack 呼叫堆疊溢位

有兩種形狀會導致它。第一種,樹裏給子節點寫了 tab? <=> tab?,而類別裏寫了 tab() { return this.Head().tab() }:子節點問擁有者,擁有者又問子節點。去掉指向你所轉發的那個子節點的 <=>第二種,某個子視圖被重新指定成了你自己的類別,而類別在樹裏列出的某個屬性上呼叫了 super。那個 super 並不是基底類別的實作,而是樹為這條繫結產生的存根,而存根又轉發回擁有者。請明確地轉發給原本的實作,見下面關於重新指定型別的那一條。

大寫開頭的值無法從 TypeScript 覆寫

<= Label* \ 產生的方法叫 Label,而類別裏的 label() 是另一個方法。子視圖首字母大寫,值首字母小寫,樹裏的大小寫決定了所產生方法的名字。

巢狀清單的每一列都顯示同一筆資料

在 GitHub 上編輯此頁這有幫助嗎?上一頁部署下一頁資料獲取
本頁內容我覆寫了屬性卻沒有任何效果,也不報錯輸入框要設定 placeholder、停用狀態或輸入類型一個詞被拆成一個個字母渲染出來畫面是空的,測試卻是綠的資料永遠載入不出來,元件卡在載入狀態循環訂閱Maximum call stack 呼叫堆疊溢位大寫開頭的值無法從 TypeScript 覆寫巢狀清單的每一列都顯示同一筆資料我改了子視圖的類別,它的內容就消失了子類別上找不到基底元件 view.ts 裏的方法宣告在同一個 view.tree 檔案裏的基底元件丟了自己的行為樣式在子視圖和它內部的元件之間串了針對 false 屬性的選擇器永遠匹配不上樣式裏寫了數字卻毫無變化捲動視圖的兩個子節點疊在了一起minimal_height 看不出任何效果嵌入的元件把頁面撐得左右捲動第三方 CSS 對我的元件不起作用點擊指向當前頁面的連結反而清空了 URL我的輸入處理器每次渲染都會執行我在 value 的 setter 裏拋出的錯誤從來不顯示帶鍵的處理器繫結被報告為缺失打包結果裏出現了我從未用過的模組下一步
Type to search the documentation.