[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"blog-vueionic中typescript改寫為javascript的一些做法":3},{"id":4,"slug":5,"title":6,"description":7,"content":8,"date":9,"image":10,"imageAlt":6,"author":11,"categories":14,"path":19,"minRead":20},136,"vueionic中typescript改寫為javascript的一些做法","[Vue]ionic中TypeScript改寫為JavaScript的一些做法","ionic中TypeScript改寫為JavaScript的一些做法 好吧，這問題完全是個人還沒學TypeSc […]","\u003Ch1>ionic中TypeScript改寫為JavaScript的一些做法\u003C\u002Fh1>\n\u003Cp>好吧，這問題完全是個人還沒學TypeScript的關係所衍生出來的(遮臉)，使用ionic的vue版本時，預設會有大量TypeScript的寫法，官方有說他們偏好TypeScript，但實際使用時可以關閉TypeScript(\u003Ca href=\"https:\u002F\u002Fionicframework.com\u002Fdocs\u002Fvue\u002Fquickstart\" title=\"參考如下\">參考\u003C\u002Fa>)，由於個人對TypeScript沒那麼熟，所以這次開發就關光光了，但也出現這次得狀況。\u003C\u002Fp>\n\u003Cp>這次在\u003Ca href=\"https:\u002F\u002Fionicframework.com\u002Fdocs\u002Fapi\u002Finfinite-scroll\" title=\"ion-infinite-scroll\">ion-infinite-scroll\u003C\u002Fa>中遇到一些問題，像是(可以參考連結中的範例)：\u003C\u002Fp>\n\u003Cpre>\u003Ccode class=\"language-javascript\">const items = ref<number[]>([]);\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>對我來說這是一個陌生的寫法，一開始看到錯誤還在想到底哪邊出了問題，回想了一下發現這應該是個ts的寫法，從前後文推測這只是一個陣列宣告，於是改寫成這樣就通了。\u003C\u002Fp>\n\u003Cpre>\u003Ccode class=\"language-javascript\">const items = [];\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>另外像是\u003C\u002Fp>\n\u003Cpre>\u003Ccode class=\"language-javascript\">const loadData = (ev: InfiniteScrollCustomEvent) => {\n      setTimeout(() => {\n        pushData();\n        console.log('Loaded data');\n        ev.target.complete();\n        \u002F\u002F App logic to determine if all data is loaded\n        \u002F\u002F and disable the infinite scroll\n        if (items.value.length === 1000) {\n          ev.target.disabled = true;\n        }\n      }, 500);\n    }\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>其實也是一般的箭頭函式，ev宣告是ts的寫法，所以這樣改寫也就可以囉。\u003C\u002Fp>\n\u003Cpre>\u003Ccode class=\"language-javascript\">const loadData = (event) => {\n      setTimeout(() => {\n        pushData();\n        console.log('Loaded data');\n        event.target.complete();\n\n        \u002F\u002F App logic to determine if all data is loaded\n        \u002F\u002F and disable the infinite scroll\n        if (skipitems === 2000) {\n          event.target.disabled = true;\n        }\n      }, 500);\n    }\u003C\u002Fcode>\u003C\u002Fpre>\n","2022-10-02T16:10:02","\u002Fapi\u002Fproxy-image?url=https%3A%2F%2Fpost.billxu.net%2Fwp-content%2Fuploads%2F2022%2F09%2Fframework_ionic.jpeg",{"name":12,"link":13},"Chih Fan","http:\u002F\u002Fpost.billxu.net",[15,17],{"name":16,"slug":16},"frontend",{"name":18,"slug":18},"vue","\u002Fblog\u002Fvueionic中typescript改寫為javascript的一些做法",1]