鴻蒙應用開發踩坑記之路由跳轉

2022-01-10 11:52:53 字數 1726 閱讀 6729

本來打算先搞地圖方面的開發,但是遇到一些,已經在官方論壇發帖求助了:

關於js ui開發的一些問題

大家如果對鴻蒙應用開發有興趣,也去幫我催催官方吧。

這兩天mac os發布了最新的版本,鴻蒙的開發工具也發布了mac版本,這兩件事稍許沖淡了我在鴻蒙應用開發中遇到的不快。

今天就來繼續做一下路由跳轉。

這個功能就在之前的專案基礎上做,請參考我之前的文章:

鴻蒙系統應用開發之js實現乙個簡單的list

要做路由,首先要在config.json中加上page:

"js": [}]

js是在config的module中,js ui專案生成的時候會已經有了。

接下來就在js/page資料夾下增加這個music資料夾,需要新建的檔案和index下一致。

然後我們就可開始改造之前的index部分。

}

這個時候出現了問題,我要怎麼把頻道id傳給這個函式呢?

翻了下文件,我發現官方並沒有明確說明箭頭函式或者bind方法能不能用。

那我就姑且當作可以吧。

嘗試之後,兩個都不行……

這個onclick裡面只能放函式名……

好吧,於是我修改了一下:

}
然後在index.js裡面增加goto方法:

goto(e)})}

這個事件響應總是要傳乙個event物件的,從event物件上拿到target,就可以拿到這個id了。

哦,別忘記在index.js引入router:

import router from 『@system.router』;

然後用push方法跳轉到相應的頁面,可以把引數帶過去,params下的channelid會直接放在music/index的data裡面。

import fetch from '@system.fetch';

export default ,

},oninit() ,

fail: function(data, code) ,})}

}

哦,大家注意到沒有,使用的介面變了,獲取頻道的介面用獲取**的介面用了

這個我在log裡面列印了一下結果,發現song是空陣列,如果是相同的鏈結放在瀏覽器裡,是可以獲取到song的。

所以我就修改了一下header:

fetch.fetch(,

success: function(response) ,

fail: function(data, code) ,

})

果然帶上cookie和ua之後,順利拿到了song。

接下來就是在music/index .hml裡展現出來了。

}    

頁面的結構沒有問題,不過樣式我調整了半天。

這裡最主要的問題就是image標籤,這是hml裡面自帶的元件,根據使用下來的感受,這個image元件跟原生的img標籤可是完全不一樣的:

.image
最好是強行設定寬高,目前我還沒太搞清楚這裡面的樣式問題。

最後的結果就是:

鴻蒙 Hi3861開發環境搭建踩坑記

官方關於開發環境搭建已經說的很清楚了,但是每個人的電腦環境配置都不同,很難說一步順利到位的。linux是用於搭建編譯環境的,windwos主要是搭建乙個燒錄 的環境。不得不說,個人覺得這個windows上的環境整的相對複雜了些,對初學不友好。linux上的坑主要是python3的版本和scons的版...

開發快應用踩坑集錦

快應用開發過程踩坑集錦彙總 開發快應用學習資料及踩坑問題彙總 持續更新,調整 by qzx 參考 快應用環境搭建及安裝 環境搭建 pc安裝toolkit工具 踩坑整理 1.修改日誌輸出等級 2.console.dir 無法使用 3.安裝專案依賴必須用 npm install cnpm和yarn安裝都...

快應用開發的踩坑之旅

1.更新 rpk 的時候出現版本號必須高於上乙個版本的錯誤提示 出現這個問題是因為快應用官方以配置 manifest.json 的屬性versioncode的值來確認版本更新,官方要求每次上架更新需要將該值手動 自增1。很多同學會誤以為修改 versionname 來更新版本,versionname...