Vue->封裝返回上一頁方法

前言

特別是在移動端開發項目中會出現這樣一個場景,在二級或者詳情頁的時候頂部導航或有出現一個返回上一頁的按鈕,該按鈕的做用就是點擊以後返回上一頁或者歷史頁面,那麼問題來了,是否是有不少個這樣的頁面或者不少個這樣的圖標咱們都要手動去綁定一個方法,再寫一遍一樣的邏輯呢,本文章帶你封裝一個全局的返回上一頁的方法前端

第一步


在main.js中將方法掛礙到原型鏈上
Vue.prototype.back = () => $router.bck(-1)
複製代碼

第二步


在須要使用返回上一頁的事件中直接這樣寫
<div @click="back">返回上一頁</div>
複製代碼

說明


該back方法就是咱們在全局經過vue原型鏈掛載的公用的方法,就不用每次去從新定義給一個事件寫一遍放方法,顯得太繁瑣還很差維護。

寫在最後

但願個人分享對你有所幫助,更多資訊請持續關注,我會分享愈來愈多的實戰經驗哦! 或加入大前端知識體系社區一塊兒探索技術:608229520vue

相關文章
相關標籤/搜索