vue3如何直接修改reactive定義的變量
更新時間：2024年05月09日 14:47:59 作者：如白駒過隙
這篇文章主要介紹了vue3如何直接修改reactive定義的變量問題,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教
vue3直接修改reactive定義變量
reactive定義的數(shù)組或者對象，不能直接賦值修改，否則定義的數(shù)據(jù)將失去響應(yīng)性
可以通過Object.assign修改
let rowData = reactive({})
// 修改rowData的值
Object.assign(rowData, row)vue批量修改reactive中的值
reactive聲明響應(yīng)式對象，但修改值會比較麻煩，比如
<script setup>
import {reactive} from 'vue';
let obj = reactive({
id:1,
name:'張三',
age:18
})
obj.id = 2;
obj.name = '李四';
</script>
但是不能直接賦值，這樣會失去響應(yīng)性
obj = {id:2,name:'李四'}解決方法
使用Object.assign
obj = Object.assign(obj,{id:2,name:'李四'})
總結(jié)
以上為個人經(jīng)驗，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關(guān)文章
最近接手做一個前端小項目，基于vue實現(xiàn)答題功能，具體功能有判斷用戶是否答對，答對的話跳到下一題，答錯的話彈窗告訴用戶有錯題，請重新答題，功能非常人性化，對實現(xiàn)代碼感興趣的朋友一起看看吧2021-06-06
響應(yīng)系統(tǒng)是Vue.js的一個顯著功能，修改屬性，可以更新視圖，這讓狀態(tài)管理變得非常簡單且直觀。這篇文章主要給大家介紹如何利用Vue.js實現(xiàn)觀察屬性的變化，有需要的朋友們可以參考借鑒，感興趣的朋友們下面來一起看看吧。2016-11-11
詳解vuex 中的 state 在組件中如何監(jiān)聽
本篇文章主要介紹了詳解vuex 中的 state 在組件中如何監(jiān)聽，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-05-05
vue+vue-validator 表單驗證功能的實現(xiàn)代碼
這篇文章主要介紹了vue+vue-validator 表單驗證功能的實現(xiàn)代碼,非常不錯，具有參考借鑒價值，需要的朋友可以參考下2017-11-11
本篇文章主要介紹了vue2里面ref的具體使用方法，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-10-10
Vue+ElementUI實現(xiàn)動態(tài)更換任意主題色(動態(tài)換膚)的全過程
眾所周知Element-UI有換膚功能,下面這篇文章主要給大家介紹了關(guān)于Vue+ElementUI實現(xiàn)動態(tài)更換任意主題色(動態(tài)換膚)的相關(guān)資料,文中通過實例代碼介紹的非常詳細,需要的朋友可以參考下2023-02-02
這篇文章主要介紹了vite+vue3搭建的工程熱更新失效問題及解決方案,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2024-03-03
這篇文章主要介紹了vue多個元素的樣式選擇器問題，本文通過實例代碼給大家介紹的非常詳細，具有一定的參考借鑒價值,需要的朋友可以參考下2019-11-11
在我們實際項目開發(fā)過程中，會非常頻繁地和 Vue 組件的生命周期打交道，接下來我們就從源碼的角度來看一下這些生命周期的鉤子函數(shù)是如何被執(zhí)行的,需要的朋友可以參考下面文章內(nèi)容2021-09-09
vue.js 實現(xiàn)圖片本地預(yù)覽 裁剪 壓縮 上傳功能
這篇文章主要介紹了vue.js 實現(xiàn)圖片本地預(yù)覽裁剪壓縮上傳功能,代碼簡單易懂，非常不錯，具有參考借鑒價值，需要的朋友可以參考下2018-03-03