第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號(hào)安全,請及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問題,去搜搜看,總會(huì)有你想問的

Vue TypeError:嘗試更新對象屬性時(shí)無法讀取未定義的屬性“_wrapper”

Vue TypeError:嘗試更新對象屬性時(shí)無法讀取未定義的屬性“_wrapper”

千萬里不及你 2023-10-14 16:06:04
我正在嘗試使用按鈕來更新 Vue 中對象的屬性。該對象由 AJAX 查詢返回到數(shù)據(jù)庫,然后isFetching將布爾值設(shè)置為false,這會(huì)將包含的 div 附加到 DOM。當(dāng)我嘗試更新屬性時(shí),出現(xiàn)以下錯(cuò)誤:TypeError: Cannot read property '_wrapper' of undefined下面是我的 AJAX 代碼:axios.post("/api/myEndpoint", { id: router.currentRoute.query.id })    .then((response) => {        this.activities = response.data.activities;        this.isFetching = false;    })    .catch((errors) => {            console.log(errors);        router.push("/");        });          這是我的 HTML:<div v-if="isFetching">  <h2>Loading data...</h2></div><div v-else>    <div class="row no-gutters">        <div class="col">            <div class="d-flex flex-row justify-content-center">                <h4>Activities</h4>            </div>            <div class="custom-card p-2">                <div class="row no-gutters pb-4" v-for="(activity, index) in activities"                  :key="activity.stage_id">                    <button v-if="!activity.is_removed" class="btn custom-btn" :class="{'hov':                      index == 0}" :disabled="index != 0"                      @click="markRemoved(activity)">Remove</button>                </div>            </div>        </div>    </div></div>最后,這是markRemoved()由按鈕的單擊偵聽器調(diào)用的:markRemoved(a) {  a.is_removed = true;}當(dāng)我嘗試登錄時(shí),a對象markRemoved()會(huì)很好地記錄到控制臺(tái),完全符合預(yù)期。is_removed在調(diào)試器中單步調(diào)試它后,在我嘗試更新對象的屬性時(shí)拋出異常。有誰知道我在這里做錯(cuò)了什么?注意:我傳遞給AJAX查詢的id是Vue Router的查詢參數(shù)。這也設(shè)置正確并按預(yù)期通過。這是一個(gè)示例activity對象:{date_time_due: "2020-12-09T11:43:07.740Z" date_time_reached_stage: "2020-12-02T11:43:07.740Z" is_complete: true is_removed: false selected_option: "Some text" stage_id: 1 stage_name: "Some text"}僅在第一次單擊按鈕時(shí)引發(fā)異常。
查看完整描述

1 回答

?
Cats萌萌

TA貢獻(xiàn)1805條經(jīng)驗(yàn) 獲得超9個(gè)贊

發(fā)布以防其他人將來遇到此錯(cuò)誤。


Vue 只需要單文件組件標(biāo)簽中的一個(gè)根元素<template>。我已經(jīng)忘記了這一點(diǎn),在我的例子中,有兩個(gè)<div>元素,一次顯示一個(gè),有條件地使用 v-if:


<template>

    <div v-if="fetchingData">

        <h2>Loading data...</h2>

    </div>

    <div v-else>

        <!-- The rest of the component -->

    </div>

</template>

這導(dǎo)致了 Vue 的反應(yīng)性問題,每當(dāng)我嘗試更新組件的某些部分時(shí)就會(huì)拋出錯(cuò)誤。意識(shí)到自己的錯(cuò)誤后,我將所有內(nèi)容都包裹在 root 中<div>。這為我解決了這個(gè)問題:


<template>

    <div id="fixedComponent">

        <div v-if="fetchingData">

            <h2>Loading data...</h2>

        </div>

        <div v-else>

            <!-- The rest of the component -->

        </div>

    </div>

</template>


查看完整回答
反對 回復(fù) 2023-10-14
  • 1 回答
  • 0 關(guān)注
  • 129 瀏覽
慕課專欄
更多

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)