国产 无码 综合区,色欲AV无码国产永久播放,无码天堂亚洲国产AV,国产日韩欧美女同一区二区

vue數(shù)據(jù)更新但視圖(DOM)不刷新解決辦法

這篇具有很好參考價(jià)值的文章主要介紹了vue數(shù)據(jù)更新但視圖(DOM)不刷新解決辦法。希望對大家有所幫助。如果存在錯誤或未考慮完全的地方,請大家不吝賜教,您也可以點(diǎn)擊"舉報(bào)違法"按鈕提交疑問。

第一種:強(qiáng)制更新dom

<div v-if="isTrue">{{num}}</div>
data(){
    return {
        isTrue: true,
        num: 0
    }
}
aa () {
    this.isTrue = false // 強(qiáng)制刷新視圖
    this.num++
    this.isTrue = true // 強(qiáng)制刷新視圖
}

第二種:vue.$set(要操作的對象或數(shù)組, 對象key/索引, 修改后的值)


// vue.$set 修改對象或數(shù)組的數(shù)據(jù)主要是添加響應(yīng)式getter和setter讓其擁有數(shù)據(jù)響應(yīng)的特性
// this.$set( target, propertyName/index, value ) 
// vue 中this及vue


// 例子1: 比如修改name值沒有生效

this.form.name = "111"  // 等同于 ==>
const name = "111"
this.$set(this.form, 'name', '111')
// 或
this.$set(this.form, 'name', name)


// 例子2:修改數(shù)組
let arr =[{name: "name1", sex: "男"},{name: "name2", sex: "男"}]

this.$set(arr, 1, {name: "name2", sex: "女"})


第三種: vue.$forceUpdate()


// 賦值之后強(qiáng)制更新視圖

如
aa () {
    this.form = {
                    a: 'a',
                    b: 'b'
                }
    // 但是dom沒有發(fā)生變化 數(shù)據(jù)賦值之后加上
    this.$forceUpdate()
}

對此有什么疑問 或者 其它前端面臨的問題都可以來歡迎評論? 在下知道的定會幫你回答希望能夠幫到你 (#^.^#)文章來源地址http://www.zghlxwxcb.cn/news/detail-513227.html

到了這里,關(guān)于vue數(shù)據(jù)更新但視圖(DOM)不刷新解決辦法的文章就介紹完了。如果您還想了解更多內(nèi)容,請?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章,希望大家以后多多支持TOY模板網(wǎng)!

本文來自互聯(lián)網(wǎng)用戶投稿,該文觀點(diǎn)僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務(wù),不擁有所有權(quán),不承擔(dān)相關(guān)法律責(zé)任。如若轉(zhuǎn)載,請注明出處: 如若內(nèi)容造成侵權(quán)/違法違規(guī)/事實(shí)不符,請點(diǎn)擊違法舉報(bào)進(jìn)行投訴反饋,一經(jīng)查實(shí),立即刪除!

領(lǐng)支付寶紅包贊助服務(wù)器費(fèi)用

相關(guān)文章

  • uni-app小程序父組件數(shù)據(jù)更新,實(shí)現(xiàn)自定義組件刷新視圖

    uni-app小程序父組件數(shù)據(jù)更新,實(shí)現(xiàn)自定義組件刷新視圖

    之前錯誤的思路 新思路(忽略我的參數(shù)命名,寫文章的時候方便。)

    2024年02月16日
    瀏覽(27)
  • vue3 - 使用reactive定義響應(yīng)式數(shù)據(jù)進(jìn)行列表賦值時,視圖沒有更新的解決方案

    vue3 - 使用reactive定義響應(yīng)式數(shù)據(jù)進(jìn)行列表賦值時,視圖沒有更新的解決方案

    在Vue 3.0 中我們使用 reactive() 定義的響應(yīng)式數(shù)據(jù)的時候,當(dāng)是一個數(shù)組或?qū)ο髸r,我們直接進(jìn)行賦值,發(fā)現(xiàn)數(shù)據(jù)已經(jīng)修改成功,但是頁?并沒有自動渲染成最新的數(shù)據(jù);這是為什么呢? 就如同官網(wǎng)所說的reactive存在一些 局限性 :(官方的描述) 原因就是reactive函數(shù)會返回一個

    2024年02月13日
    瀏覽(33)
  • vue/react項(xiàng)目刷新頁面出現(xiàn)404的原因以及解決辦法

    問題描述:vue/react項(xiàng)目,正常的頁面操作跳轉(zhuǎn),不會出現(xiàn)404的問題,但是一旦刷新,就會出現(xiàn)404報(bào)錯。 產(chǎn)生原因:我們打開vue/react打包后生成的dist文件夾,可以看到只有一個 index.html 文件及一些靜態(tài)資源,這個是因?yàn)関ue/react是單頁應(yīng)用(SPA),只有一個index.html作為入口文件,

    2024年02月06日
    瀏覽(28)
  • 關(guān)于vue路由跳轉(zhuǎn)后的頁面不會刷新的解決辦法

    做uni項(xiàng)目的時候遇到的情況:1,父組件頁面刷新了之后 需要觸底加載的子組件能觸底加載,否則不能加載。2,子組件不能觸底加載,只需要刷新之后就能觸底加載。以上的刷新不包括下拉刷新。3. 可能因?yàn)榘艘粚觮ab頁導(dǎo)致跳轉(zhuǎn)進(jìn)頁面沒有請求數(shù)據(jù)的問題。 我的解決辦法是

    2024年02月11日
    瀏覽(28)
  • elementUI點(diǎn)擊當(dāng)前行更改當(dāng)前行狀態(tài)(數(shù)據(jù)更新DOM不更新問題解決)

    cloneDeep:在很多情況下,我們都需要給變量賦值,給內(nèi)存地址賦予一個值,但是在賦值 引用值類型 的時候,只是 共享一個內(nèi)存區(qū)域 ,導(dǎo)致賦值的時候,還跟之前的值保持一致性。

    2024年02月14日
    瀏覽(22)
  • vue3 使用UI框架reactive數(shù)據(jù)更新,視圖不更新問題

    本篇主要記錄兩個問題,然而這兩個問題又都可以對應(yīng)同一種解法。廢話少說,解決方法在最上面。推薦格式如下: 一定一定要再多包一層,不然就會遇到一些問題。(⊙﹏⊙)雖然這是一句廢話。下面的內(nèi)容過于基礎(chǔ)且本篇只記錄bug和解法,想要探求為什么的呢,還請自己去

    2024年02月12日
    瀏覽(26)
  • vue3中數(shù)據(jù)更新了,但是視圖沒有更新的5中方案

    vue 3.0 ref 和 Reactive 數(shù)據(jù)響應(yīng)式,以及使用 Reactive 數(shù)據(jù)已更新但頁面沒有同步刷新異常 方案1:Vue 3.0 中我們使用 reactive() 定義的響應(yīng)式數(shù)據(jù)的時候,當(dāng)我們對象再次賦值,我們發(fā)現(xiàn)數(shù)據(jù)已經(jīng)修改成功,但是頁?并沒有自動渲染成最新的數(shù)據(jù); 這時我們可以改成 ref () 或者對

    2024年01月18日
    瀏覽(27)
  • Vue計(jì)算屬性:簡化數(shù)據(jù)處理和視圖更新的利器

    Vue計(jì)算屬性:簡化數(shù)據(jù)處理和視圖更新的利器

    計(jì)算屬性:一個特殊屬性,值依賴于另外一些數(shù)據(jù)動態(tài)計(jì)算出來。 ?????? 計(jì)算屬性特點(diǎn):函數(shù)內(nèi)使用的變量改變,重新計(jì)算結(jié)果返回。 ?????? 注意: ①、計(jì)算屬性必須定義在computed節(jié)點(diǎn)中。 ②、計(jì)算屬性必須是一個function,計(jì)算屬性必須有返回值。 ③、計(jì)算屬性不能

    2024年02月16日
    瀏覽(23)
  • vue通過router地址傳參跳轉(zhuǎn)同一路由頁面,頁面不刷新的解決辦法

    vue、 vue-router@4 記錄一下最近遇到的vue路由頁面間的跳轉(zhuǎn)的問題,其中就涉及到了不同路由的跳轉(zhuǎn)(/a/b1 = /a/b2)、相同路由不同參數(shù)間的跳轉(zhuǎn)(/a/b?c=1 = /a/b?c=2)、相同頁面錨點(diǎn)跳轉(zhuǎn)(/a/b#id1 =/a/b#id2) 原因:渲染的是同一組件 解決:可以在不刷新的頁面通過監(jiān)聽route,重新加載

    2024年02月04日
    瀏覽(22)
  • Vue 出現(xiàn)Syntax Error:TypeError: Cannot read property ‘vue‘ of undefined的一種解決辦法

    Vue 出現(xiàn)Syntax Error:TypeError: Cannot read property ‘vue‘ of undefined的一種解決辦法

    出現(xiàn)如下情況 背景:首次克隆運(yùn)行項(xiàng)目 技術(shù)背景:項(xiàng)目使用的前端框架和UI框架 :vue2+element-ui 然后npm install 安裝依賴,得到node_modules包和package-lock.json文件,然后npm run dev啟動報(bào)錯。 排查原因: 首先看了package.json 文件的node版本和npm版本支持 當(dāng)前的我的node和npm版本用的是:

    2024年02月13日
    瀏覽(26)

覺得文章有用就打賞一下文章作者

支付寶掃一掃打賞

博客贊助

微信掃一掃打賞

請作者喝杯咖啡吧~博客贊助

支付寶掃一掃領(lǐng)取紅包,優(yōu)惠每天領(lǐng)

二維碼1

領(lǐng)取紅包

二維碼2

領(lǐng)紅包