Vue引入jquery實(shí)現(xiàn)平滑滾動(dòng)到指定位置
在以往的做法里首選jquery的animate實(shí)現(xiàn)，但是Vue里并沒有這個(gè)方法。如何在Vue項(xiàng)目中實(shí)現(xiàn)點(diǎn)擊導(dǎo)航平滑滾動(dòng)到指定位置，為了這效果我是快要崩潰了，上網(wǎng)查閱了很久發(fā)現(xiàn)并沒有真正意義上解決這個(gè)問題的，之前參考了一位博主的想法：通過在一定時(shí)間內(nèi)定時(shí)分步長(zhǎng)滾動(dòng)，連續(xù)起來后肉眼觀察就是平滑滾動(dòng)的效果（點(diǎn)擊查看），當(dāng)時(shí)看到這篇文章我是心花怒放，趕緊參考代碼寫進(jìn)去，然并卵。。。根本沒有效果，后來聯(lián)系博主討論后得出結(jié)論可能是我的vue2.4版本對(duì)計(jì)時(shí)器不友好，建議我降版本，這樣的話。。。我還是繼續(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ā)射接收的方法來利用index進(jìn)行操作（發(fā)射接收的方法在我之前的博文有詳細(xì)介紹，點(diǎn)擊查看），平滑效果主要看我紅框里的代碼就可以，其他代碼是我項(xiàng)目里的東西，不需要考慮:
總結(jié)
以上所述是小編給大家介紹的Vue引入jquery實(shí)現(xiàn)平滑滾動(dòng)到指定位置，希望對(duì)大家有所幫助，如果大家有任何疑問請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！
相關(guān)文章
這篇文章主要介紹了vue中使用swiper失效問題及解決，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2023-01-01
本篇文章主要介紹了Vue2.0用戶權(quán)限控制解決方案的示例，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2018-02-02
vue?require.context()的用法實(shí)例詳解
require.context是webpack提供的一個(gè)api,通常用于批量注冊(cè)組件,下面這篇文章主要給大家介紹了關(guān)于vue?require.context()用法的相關(guān)資料,文中通過實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下2023-04-04
你了解vue3.0響應(yīng)式數(shù)據(jù)怎么實(shí)現(xiàn)嗎
這篇文章主要介紹了你了解vue3.0響應(yīng)式數(shù)據(jù)怎么實(shí)現(xiàn)嗎，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2019-06-06
虛擬列表是一種技術(shù)，它只渲染用戶當(dāng)前可見的列表項(xiàng)，而不是渲染整個(gè)列表，這篇文章主要來和大家聊聊虛擬列表的原理與實(shí)現(xiàn)，希望對(duì)大家有所幫助2023-05-05
解決Vue2.0中使用less給元素添加背景圖片出現(xiàn)的問題
今天小編就為大家分享一篇解決Vue2.0中使用less給元素添加背景圖片出現(xiàn)的問題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2018-09-09
這篇文章主要介紹了解決vue中監(jiān)聽返回鍵問題,非常不錯(cuò)，具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2019-08-08
vue組件定義，全局、局部組件，配合模板及動(dòng)態(tài)組件功能示例
這篇文章主要介紹了vue組件定義，全局、局部組件，配合模板及動(dòng)態(tài)組件功能,結(jié)合實(shí)例形式分析了vue.js中組件的定義、全局組件、局部組件、配合模板組件及動(dòng)態(tài)組件的相關(guān)使用方法與操作注意事項(xiàng),需要的朋友可以參考下2019-03-03
這篇文章主要介紹了vue axios同步請(qǐng)求解決方案,需要的朋友可以參考下2017-09-09
組件 (Component) 是 Vue.js 最強(qiáng)大的功能之一。組件可以擴(kuò)展 HTML 元素，封裝可重用的代碼。下面通過本文給大家分享Vue.js組件通信的幾種姿勢(shì)，感興趣的朋友一起看看吧2017-10-10