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

關于JS UI開發的一些問題?developer.huawei.com

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

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

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

這個功能就在之前的項目基礎上做，請參考我之前的文章：

James：鴻蒙系統應用開發之JS實現一個簡單的List?zhuanlan.zhihu.com

要做路由，首先要在config.json中加上page：

"js"

js是在config的module中，js UI項目生成的時候會已經有了。

接下來就在js/page文件夾下增加這個music文件夾，需要新建的文件和index下一致。

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

<

這個時候出現了問題，我要怎么把頻道id傳給這個函數呢？

翻了下文檔，我發現官方并沒有明確說明箭頭函數或者bind方法能不能用。

那我就姑且當作可以吧。

嘗試之后，兩個都不行……

這個onclick里面只能放函數名……

好吧，于是我修改了一下：

<text class="item" onclick="goto" id="{{$item.channel_id}}">{{$item.name}}</text>

然后在index.js里面增加goto方法：

goto

這個事件響應總是要傳一個event對象的，從event對象上拿到target，就可以拿到這個id了。

哦，別忘記在index.js引入router：

import

然后用push方法跳轉到相應的頁面，可以把參數帶過去，params下的channelId會直接放在music/index的data里面。

import

哦，大家注意到沒有，使用的接口變了，獲取頻道的接口用https://douban.fm/j/v2/channels，獲取音樂的接口用了https://douban.fm/j/v2/playlist。

這個我在log里面打印了一下結果，發現song是空數組，如果是相同的鏈接放在瀏覽器里，是可以獲取到song的。

所以我就修改了一下header：

fetch

果然帶上cookie和UA之后，順利拿到了song。

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

<

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

這里最主要的問題就是image標簽，這是hml里面自帶的組件，根據使用下來的感受，這個image組件跟原生的img標簽可是完全不一樣的：

.

最好是強行設置寬高，目前我還沒太搞清楚這里面的樣式問題。

最后的結果就是：

因為遠程調試，也沒有辦法播放音樂，所以就不做播放功能了，先去嘗試一下其他組件吧。

總結

以上是生活随笔為你收集整理的js跳转页面时添加header_鸿蒙应用开发踩坑记之路由跳转的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。