需求說明

如圖，我想要實現當點選字母L，頁面定位到L開頭的城市名

Do it

1.找到字母表的頁面

在html標籤繫結一個click事件，在js中定義一個方法，並使用引數e獲取點選的字母。當在頁面點選時，console出來

效果如下

2.通過city這個父頁面，進行列表頁和字母表頁面的值傳遞

<1>在字母表頁定義一個監聽方法

<2>進入city頁面，在html中繫結一個監聽事件

在js中編寫這個事件的方法

開啟頁面，可以看到沒有問題，city頁面監聽到了字母表頁面的點選

<3>city父頁面把字母表頁面的請求轉發給list頁面

首先我們要在city頁面定義一個letter變數，然後在方法中定義用這個變數接受letter

然後還是city頁面，我們要在html中繫結這個變數

3.子元件獲取父元件傳遞過來的值

父元件傳遞過來了一個letter之後，子元件就要接受這個letter。

首先在list頁面中先定義letter，然後利用監聽器，一旦letter變化，只要letter不是空，那麼就讓滾動條滾動到這個元素的起始位置

最後記得在城市列表區域內註冊一個引用資訊:ref=key，用來監聽你選中的key值

儲存後，實現了聯動效果。

總結

以上所述是小編給大家介紹的Vue實現兄弟元件間的聯動效果，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回覆大家的。在此也非常感謝大家對我們網站的支援！
如果你覺得本文對你有幫助，歡迎轉載，煩請註明出處，謝謝！