首页 前端知识 Vue 3.0 中重置 reactive 定义的响应式对象数据,恢复为初始值

Vue 3.0 中重置 reactive 定义的响应式对象数据,恢复为初始值

2024-03-13 00:03:12 前端知识 前端哥 717 655 我要收藏

Vue 3.0 中如何重置 reactive 定义的数据,恢复为初始值? - 知乎

1、直接挨个重置数据(不适用对象中有多个属性,比较繁琐)

import { reactive } from 'vue'

const state = reactive({
  count: 0,
  name: 'John'
})


// 重置数据:
state.count = 0
state.name = 'John'

2、使用Object.assign()

import { reactive, ref } from "vue";

//保存初始化数据
const initInputData = {
  datasourceName: "",
  driverClassName: "",
  url: "",
  userName: "",
  password: "",
  startYear: "",
  endYear: "",
  status: true,
  action: "submit",
  id: "",
  ip:'',
  port:''
}
const inputData = reactive({...initInputData});

//重置函数
const resetInputData = () => {
  Object.assign(inputData,initInputData)
}

转载请注明出处或者链接地址:https://www.qianduange.cn//article/3744.html
标签
评论
发布的文章

JavaScript基础库

2024-04-09 00:04:11

解决vue npm 下载echart出错

2024-04-09 00:04:05

Echarts中option属性设置

2024-04-08 23:04:58

大家推荐的文章
会员中心 联系我 留言建议 回顶部
复制成功!