Vue引入jquery實(shí)現(xiàn)平滑滾動(dòng)到指定位置
在以往的做法里首選jquery的animate實(shí)現(xiàn)，但是Vue里并沒(méi)有這個(gè)方法。如何在Vue項(xiàng)目中實(shí)現(xiàn)點(diǎn)擊導(dǎo)航平滑滾動(dòng)到指定位置，為了這效果我是快要崩潰了，上網(wǎng)查閱了很久發(fā)現(xiàn)并沒(méi)有真正意義上解決這個(gè)問(wèn)題的，之前參考了一位博主的想法：通過(guò)在一定時(shí)間內(nèi)定時(shí)分步長(zhǎng)滾動(dòng)，連續(xù)起來(lái)后肉眼觀察就是平滑滾動(dòng)的效果（點(diǎn)擊查看），當(dāng)時(shí)看到這篇文章我是心花怒放，趕緊參考代碼寫(xiě)進(jìn)去，然并卵。。。根本沒(méi)有效果，后來(lái)聯(lián)系博主討論后得出結(jié)論可能是我的vue2.4版本對(duì)計(jì)時(shí)器不友好，建議我降版本，這樣的話(huà)。。。我還是繼續(xù)研究如何實(shí)現(xiàn)吧，最后實(shí)在查不到想不出什么好的方法，引入了jquery然后用animate方法幾條代碼就實(shí)現(xiàn)了這效果。
1.npm安裝jquery：npm installjquery--registry=https://registry.npm.taobao.org --verbose
2.安裝成功后修改webpack配置文件：build--webpack.base.conf.js,修改如下圖所示：
3.在vue模板的script中import這個(gè)jquery插件,然后就可以用了。我的項(xiàng)目里導(dǎo)航和其他模塊是不同組件，然后利用發(fā)射接收的方法來(lái)利用index進(jìn)行操作（發(fā)射接收的方法在我之前的博文有詳細(xì)介紹，點(diǎn)擊查看），平滑效果主要看我紅框里的代碼就可以，其他代碼是我項(xiàng)目里的東西，不需要考慮:
總結(jié)
以上所述是小編給大家介紹的Vue引入jquery實(shí)現(xiàn)平滑滾動(dòng)到指定位置，希望對(duì)大家有所幫助，如果大家有任何疑問(wèn)請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！
相關(guān)文章
本文主要介紹了Vue實(shí)現(xiàn)自定義右擊刪除菜單的示例，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2023-02-02
vue-cli3.X快速創(chuàng)建項(xiàng)目的方法步驟
這篇文章主要介紹了vue-cli3.X快速創(chuàng)建項(xiàng)目的方法步驟，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2019-11-11
vue+epubjs實(shí)現(xiàn)電子書(shū)閱讀器的基本功能
這篇文章主要為大家詳細(xì)介紹了如何使用vue+epubjs實(shí)現(xiàn)電子書(shū)閱讀器的基本功能,文中的示例代碼講解詳細(xì),感興趣的小伙伴可以跟隨小編一起學(xué)習(xí)一下2023-11-11
Vue $mount實(shí)戰(zhàn)之實(shí)現(xiàn)消息彈窗組件
這篇文章主要介紹了Vue $mount實(shí)現(xiàn)消息彈窗組件的相關(guān)知識(shí)，非常不錯(cuò)，具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2019-04-04
這篇文章主要介紹了vue-cli3配置與跨域處理方法，非常不錯(cuò)，具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2019-08-08
這篇文章主要為大家詳細(xì)介紹了用Vue封裝導(dǎo)航欄組件的方法，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2021-09-09
VUE?axios每次請(qǐng)求添加時(shí)間戳問(wèn)題
這篇文章主要介紹了VUE?axios每次請(qǐng)求添加時(shí)間戳問(wèn)題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2023-01-01
vue 解決路由只變化參數(shù)頁(yè)面組件不更新問(wèn)題
今天小編就為大家分享一篇vue 解決路由只變化參數(shù)頁(yè)面組件不更新問(wèn)題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2019-11-11
vue中watch監(jiān)聽(tīng)不到變化的解決
本文主要介紹了vue中watch監(jiān)聽(tīng)不到變化的解決，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2023-01-01
響應(yīng)式就是當(dāng)對(duì)象本身(對(duì)象的增刪值)或者對(duì)象屬性(重新賦值)發(fā)生變化時(shí),將會(huì)運(yùn)行一些函數(shù),最常見(jiàn)的就是render函數(shù),下面這篇文章主要給大家介紹了關(guān)于Vue3響應(yīng)式原理的相關(guān)資料,需要的朋友可以參考下2022-12-12