vue3.0中使用nextTick方式
更新時(shí)間：2024年04月26日 09:21:19 作者：浩星
這篇文章主要介紹了vue3.0中使用nextTick方式,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教
這里分享3.0和2.0 的方法對(duì)比
nextTick 是將回調(diào)推遲到下一個(gè) DOM 更新周期之后執(zhí)行。
在更改了一些數(shù)據(jù)以等待 DOM 更新后立即使用它
vue3.0
1、引入
import { nextTick } from 'vue'2、具體使用，配合異步
setup() {
const message = ref('Hello!')
const changeMessage = async newMessage => {
message.value = newMessage
await nextTick()
console.log('Now DOM is updated')
}
}3、具體使用，普通
方法里：
setup () {
let otherParam = reactive({
showA:false
})
nextTick(()=>{
otherParam.showA = true
})
return {
otherParam
}
}頁面上：
<a-boo v-if="otherParam.showA"></a-boo>
vue2.0
this.abc = false
this.$nextTick(() => {
//你要執(zhí)行的方法
this.abc = true
})總結(jié)
以上為個(gè)人經(jīng)驗(yàn)，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
使用vue3搭建后臺(tái)系統(tǒng)的詳細(xì)步驟
這篇文章主要介紹了使用vue3搭建后臺(tái)系統(tǒng)的過程記錄,本文給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2022-08-08
這篇文章主要介紹了vue實(shí)現(xiàn)微信獲取用戶信息的方法，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2019-03-03
詳解如何使用 vue-cli 開發(fā)多頁應(yīng)用
本篇文章主要介紹了詳解如何使用 vue-cli 開發(fā)多頁應(yīng)用，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-12-12
Vue2.0 axios前后端登陸攔截器(實(shí)例講解)
下面小編就為大家?guī)硪黄猇ue2.0 axios前后端登陸攔截器(實(shí)例講解)。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-10-10
vue實(shí)現(xiàn)excel文件的導(dǎo)入和讀取完整步驟
Vue的數(shù)據(jù)綁定功能非常強(qiáng)大,很適合用來讀取Excel內(nèi)容,這篇文章主要給大家介紹了關(guān)于vue實(shí)現(xiàn)excel文件的導(dǎo)入和讀取的相關(guān)資料,文中通過代碼示例介紹的非常詳細(xì),需要的朋友可以參考下2023-10-10
vue組件中節(jié)流函數(shù)的失效的原因和解決方法
這篇文章主要介紹了vue組件中節(jié)流函數(shù)的失效和解決方法，幫助大家更好的理解和學(xué)習(xí)vue框架，感興趣的朋友可以了解下2020-12-12
vue3項(xiàng)目中配置sass,vite報(bào)錯(cuò)Undefined mixin問題
這篇文章主要介紹了vue3項(xiàng)目中配置sass,vite報(bào)錯(cuò)Undefined mixin問題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2024-02-02
AT-UI 是一款基于 Vue.js 2.0 的輕量級(jí)、模塊化前端 UI 組件庫，主要用于快速開發(fā) PC 網(wǎng)站產(chǎn)品。下面通過本文給大家介紹Vue 2.0的模塊化前端 UI 組件庫，需要的朋友參考下吧2017-12-12
vue elementui 動(dòng)態(tài)追加下拉框、輸入框功能
這篇文章主要介紹了vue elementui 動(dòng)態(tài)追加下拉框、輸入框功能,本文通過示例代碼給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友參考下吧2024-04-04
vue?router進(jìn)行路由跳轉(zhuǎn)并攜帶參數(shù)的實(shí)例詳解(params/query)
在使用`router.push`進(jìn)行路由跳轉(zhuǎn)到另一個(gè)組件時(shí)，可以通過`params`或`query`來傳遞參數(shù)，這篇文章主要介紹了vue?router進(jìn)行路由跳轉(zhuǎn)并攜帶參數(shù)（params/query）,需要的朋友可以參考下2023-09-09