分类：初始状态

2021
03-30

Vue 重置data的数据为初始状态操作

在某些情况下，需要重新使用data中的数据，但是data中的数据已经被各种表单、变量等赋值，那么怎么重置data的值呢？1.逐个赋值...data(){return{name:'',sex:'',desc:''}}...//逐个赋值this.name=''this.sex=''this.desc=''这个方法比较笨，当然也可以实现效果，但是一个一个去重新赋值比较麻烦而且代码看起来也会比较乱。下面这个方法肯定是你喜欢的，一行代码搞定～2.使用Object.assign()MDN关于该方法的介绍... 继续阅读 >

2020
10-10

vue将data恢复到初始状态 && 重新渲染组件实例

1.将data恢复到初始状态Object.assign(this.$data,this.$options.data())//初始化data这里的this.$options.data()作为源对象，this.$data作为目标对象。源对象覆盖并合并目标对象中的内容，即有则覆盖，无则添加。2.重新渲染组件方法一：v-if（可以重置生命周期）虽然能实现重新渲染，但不推荐首选方法二：给组件加key值【推荐】通过修改key的值，就会重新渲染该组件方法三：this.$forceUpdate()迫使Vue实例重新渲染。... 继续阅读 >

2020
10-09

Vue页面手动刷新,实现导航栏激活项还原到初始状态

场景描述：在页面中存在顶部导航和左侧导航，左侧导航和右侧内容区使用了命名视图实现，点击左侧导航的链接时，右侧内容区相应显示不同组件内容。问题：在当前链接手动刷新浏览器（例如：浏览器地址为/enterprise/list），顶部导航激活项还原到初始状态（这里默认是“工作台”项）。原理：每次刷新都会重新实例化Vue，也就是会调用created方法。<template><el-menu:default-active="defaultActiveIndex"class="el-menu-demo"mo... 继续阅读 >