vant?toast?關(guān)閉棧溢出問題及解決
更新時(shí)間：2022年05月26日 15:54:15 作者：sleeppingforg
這篇文章主要介紹了vant?toast?關(guān)閉棧溢出問題及解決，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教
vant toast 關(guān)閉棧溢出
開發(fā)中有這樣一個(gè)常見場(chǎng)景。在發(fā)送某個(gè)異步請(qǐng)求以后，需要給出一個(gè)提示，提示停頓一定時(shí)間以后再路由跳轉(zhuǎn)至其他頁面。
vant的toast中有這樣一個(gè)方法
最初的寫法是這樣的：
而這也是才坑所在。然后你會(huì)看到：
死循環(huán)。棧溢出了。
解決的辦法
?let?toast?=?Toast({message:"提交成功",type:"success"})
?setTimeout(()=>{
?? ? ? ? ? toast.clear()
?? ? ? ? ? self.$router.push('/confirmPayment')
??},1000)vue 使用vant踩坑記
問題1
表單使用 <van-field></van-field>在頁面中只引入Form還是會(huì)報(bào)錯(cuò)
問題2
表單使用用表單自帶的提交@submit，如果表單里面有一個(gè)其他業(yè)務(wù)邏輯的按鈕不做提交操作，比如發(fā)送驗(yàn)證碼會(huì)驗(yàn)證表單中輸入框的驗(yàn)證
解決方法
第一個(gè)問題要在main.js中引入
import {
?? ?field
} from 'vant'
Vue.use(field)第二個(gè)問題 button中添加代碼native-type=“button”
<van-button size="small" type="info" native-type="button">發(fā)送驗(yàn)證碼</van-button>
以上為個(gè)人經(jīng)驗(yàn)，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
利用vue對(duì)比兩組數(shù)據(jù)差異的可視化組件詳解
這篇文章主要給大家介紹了關(guān)于利用vue對(duì)比兩組數(shù)據(jù)差異的可視化組件的相關(guān)資料,文中通過示例代碼介紹的非常詳細(xì),對(duì)大家學(xué)習(xí)或者使用vue具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2021-09-09
Vuex是一個(gè)專為Vue.js應(yīng)用程序開發(fā)的狀態(tài)管理模式,它采用集中式存儲(chǔ)管理應(yīng)用的所有組件的狀態(tài),并以相應(yīng)的規(guī)則保證狀態(tài)以一種可預(yù)測(cè)的方式發(fā)生變化,下面這篇文章主要給大家介紹了關(guān)于如何通過一篇文章帶你吃透Vuex3的狀態(tài)管理,需要的朋友可以參考下2022-07-07
vue2.0實(shí)現(xiàn)音樂/視頻播放進(jìn)度條組件
這篇文章主要為大家詳細(xì)介紹了vue2.0實(shí)現(xiàn)音樂和視頻播放進(jìn)度條組件的思路及具體實(shí)現(xiàn)方法，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2018-06-06
使用konva和vue-konva庫實(shí)現(xiàn)拖拽滑塊驗(yàn)證功能
這篇文章主要介紹了使用konva和vue-konva完成前端拖拽滑塊驗(yàn)證功能,本文通過實(shí)例代碼給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2020-04-04
VUE + UEditor 單圖片跨域上傳功能的實(shí)現(xiàn)方法
這篇文章主要介紹了VUE + UEditor 單圖片跨域上傳功能的實(shí)現(xiàn)方法，需要的朋友參考下2018-02-02
Vue3中defineProps設(shè)置默認(rèn)值的方法實(shí)現(xiàn)
Vue3中我們經(jīng)常需要使用defineProps來定義組件的屬性,本文主要介紹了Vue3中defineProps設(shè)置默認(rèn)值的方法實(shí)現(xiàn),文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2024-07-07
Element?Plus，由餓了么大前端團(tuán)隊(duì)開源出品的一套為開發(fā)者、設(shè)計(jì)師和產(chǎn)品經(jīng)理準(zhǔn)備的基于?Vue?3.0?的組件庫，Element?Plus是基于Vue3面向設(shè)計(jì)師和開發(fā)者的組件庫，提供了配套設(shè)計(jì)資源，幫助你的網(wǎng)站快速成型2022-12-12
Vue2和Vue3的nextTick實(shí)現(xiàn)原理
Vue 中的數(shù)據(jù)綁定和模板渲染都是異步的，那么如何在更新完成后執(zhí)行回調(diào)函數(shù)呢？這就需要用到 Vue 的 nextTick 方法了，本文詳細(xì)介紹了Vue2和Vue3的nextTick實(shí)現(xiàn)原理，感興趣的同學(xué)可以參考一下2023-04-04
文章展示了基于Vue封裝的標(biāo)準(zhǔn)漏斗圖的代碼,包括權(quán)重算法、滾輪監(jiān)聽和點(diǎn)擊示例功能,旨在提供實(shí)用的圖表展示技巧2025-02-02
Arco Design 作為一款專為 Vue3 打造的企業(yè)級(jí) UI 組件庫,以其豐富的特性和卓越的性能,成為現(xiàn)代 Web 應(yīng)用開發(fā)者值得關(guān)注的選擇,這篇文章主要介紹了Vue3 框架Arco Design詳解,需要的朋友可以參考下2024-08-08