vue如何將對象中所有的key賦為空值
更新時間：2022年04月08日 11:58:01 作者：zky的博客
這篇文章主要介紹了vue如何將對象中所有的key賦為空值，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教
將對象中所有的key賦為空值
Object.assign的使用，當然你也可以使用for去遍歷 然后再一一去賦值為空字符串，推薦使用（Object.assign）
先來看看Object.assign的基本用法
Object.assign方法用于對象的合并，第一個參數(shù)（目標對象），可以有第二個，第三個參數(shù)，都是源對象，將源對象（source）的所有可枚舉屬性，復制到目標對象（target）。
const target = {a:1};
const source1 = { b: 2 };
const source2 = { c: 3 };
Object.assign(target, source1, source2);
console.log(target) // {a:1, b:2, c:3}注意：Object.assign方法的第一個參數(shù)是目標對象，后面的參數(shù)都是源對象
言歸正傳，有時候會碰到的需求是，有多個input框，每個input框都v-modei綁定了對應(yīng)的value值，當點擊重置按鈕時，要清空所有input中的值，這時候可以用到Object.assign方法，具體怎么實現(xiàn)看代碼
html代碼
?<input type='text' v-model='valueData.value1'></input> ?<input type='text' v-model='valueData.value2'></input> ?<input type='text' v-model='valueData.value3'></input> ?<button @click=‘toReset'>重置（清空輸入框）<button>
js 代碼
const values = {
? value1:'',
? value2:'',
? value3:'',
}
data(){
?return {
? ?valueData:Object.assign({},values)
?}
},
methods：{
? //這時候如果你隨意在輸入框輸入值，點擊重置按鈕 ，只需要重新給valueData復制 就能清空input中的值了
?toReset(){
?this.valueData = Object.assign({},values)
?}
}vue空值報錯問題
如上圖所示，提示percent為空，web效果圖如下
如果是自測階段不想麻煩就直接在數(shù)據(jù)庫添加數(shù)據(jù)就行或者或者初始化方法賦初始值，最簡便的還是在vue template里進行判斷
代碼如下：
以上為個人經(jīng)驗，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關(guān)文章
這篇文章主要介紹了Vuejs從數(shù)組中刪除元素的示例代碼,本文結(jié)合實例代碼給大家介紹的非常詳細，對大家的學習或工作具有一定的參考借鑒價值，需要的朋友可以參考下2023-02-02
這篇文章主要介紹了vue使用計算屬性完成動態(tài)滑竿條制作，文章圍繞計vue算屬制作動態(tài)滑竿條的相關(guān)代碼完成內(nèi)容,需要的朋友可以參考一下2021-12-12
下面小編就為大家分享一篇在vue項目中,使用axios跨域處理，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2018-03-03
這篇文章主要介紹了Vue如何設(shè)置button的disable屬性，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-04-04
Vue處理循環(huán)數(shù)據(jù)流程示例精講
這篇文章主要介紹了Vue處理循環(huán)數(shù)據(jù)流程，這個又是一個編程語言，?模版語法里面必不可少的一個，?也是使用業(yè)務(wù)場景使用最多的一個環(huán)節(jié)。所以學會使用循環(huán)也是重中之重了2023-04-04
這篇文章主要為大家詳細介紹了Vue實現(xiàn)簡單登錄界面，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-06-06
這篇文章主要介紹了vue-cli項目中遇到的eslint的坑及解決，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-04-04
Elementui如何限制el-input框輸入小數(shù)點
這篇文章主要介紹了Elementui如何限制el-input框輸入小數(shù)點，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-08-08
Vant?UI中van-collapse下拉折疊面板默認展開第一項的方法
之前做項目的時候,使用了Collapse折疊面板,下面這篇文章主要給大家介紹了關(guān)于Vant?UI中van-collapse下拉折疊面板默認展開第一項的相關(guān)資料,需要的朋友可以參考下2022-03-03
今天小編就為大家分享一篇VUE實現(xiàn)強制渲染,強制更新，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2019-10-10