把一个组件重置到初始状态是一个常见的需求,推荐的做法有两种,一种是父组件重置子组件的 prop,另一种是子组件暴露一个重置的方法供父组件调用。但有些时候,子组件既没有提供重置的方法,也没提供 prop 来重置自己的状态。更重要的是,这个子组件我们还动不了。于是我们就需要一种 hack 的方式来强制子组件重置到初始状态。方法如下:

hack 的方式来强制子组件重置到初始状态

在你需要重置组件状态的操作里面加上这个句话,就可以实现组件的刷新,

v-if 在切换时,元素及它的绑定数据和组件都会被销毁并重建

vue强制刷新组件 ----组件重置到初始状态的更多相关文章

  1. vue 强制刷新组件重新渲染

    实现功能:使用富文本编辑器编写文章,然后把编写成功的文章用子组件显示. 问题描述:父组件给子组件传递数据,子组件第一次调用数据的时候页面渲染是正常的,当数据变化的时候,子组件的页面渲染就失效了. 问题 ...

  2. vue强制刷新组件

    <component v-if="hackReset"></component>(组件名称) data:hackReset (事件执行) this.hack ...

  3. vue 强制刷新组件

    <component v-if="hackReset"></component> 2 3 4 this.hackReset = false this.$ne ...

  4. vue 强制刷新 demo 神器

    this.$forceUpdate() /*关键句,强制更新dom*/

  5. asp.mvc中的vue分页实例,分页组件无法重置reload,解决点击查询按钮后,分页不刷新的问题

    刚刚接触Vue.js,现在需要做一个查询功能,并且进行服务端分页.主要思路是在页面中注册一个分页组件,然后进行调用.代码如下 1.引用vue.js,具体去网上下载 2.在html的body中添加如下代 ...

  6. vue强制组件重新渲染

    有时候,依赖 Vue 响应方式来更新数据是不够的,相反,我们需要手动重新渲染组件来更新数据.或者,我们可能只想抛开当前的DOM,重新开始.那么,如何让Vue以正确的方式重新呈现组件呢? 强制 Vue ...

  7. Unity3D UGUI强制刷新Layout(布局)组件

    UGUI的Layout布局组件确实节省了我们很多代码 如果不使用Layout组件 那么光在计算UI的布局上就要花费很大的功夫 特别是动态生成其组件的时候 当然,Layout组件在大多数时候是非常好用的 ...

  8. 用vue写一个仿app下拉刷新的组件

    如果你用vue弄移动端的页面,那么下拉刷新还是比较常见的场景,下面来研究如何写一个下拉刷新的组件(先上图); 由于节省大家的时间,样式就不贴出来了. html结构也不必介绍了,直接看代码吧-.- &l ...

  9. vue中使用keepAlive组件缓存遇到的坑

    项目开发中在用户由分类页category进入detail需保存用户状态,查阅了Vue官网后,发现vue2.0提供了一个keep-alive组件. 上一篇讲了keep-alive的基本用法,现在说说遇到 ...

随机推荐

  1. beta版本——第五次冲刺

    第五次冲刺 (1)SCRUM部分☁️ 成员描述: 姓名 李星晨 完成了哪个任务 界面优化 花了多少时间 2h 还剩余多少时间 2h 遇到什么困难 没有 这两天解决的进度 2/2 后续两天的计划 完成文 ...

  2. 剑指offer:跳台阶问题

    基础跳台阶 题目 一只青蛙一次可以跳上1级台阶,也可以跳上2级.求该青蛙跳上一个n级的台阶总共有多少种跳法(先后次序不同算不同的结果). 解题思路 这道题就是斐波那契数列的变形问法,因为跳上第N个台阶 ...

  3. HTTP get post 请求实例

    package wzh.Http; import java.io.BufferedReader; import java.io.IOException; import java.io.InputStr ...

  4. Echo团队Alpha冲刺随笔 - 第九天

    项目冲刺情况 进展 已经进入测试阶段,正在消除系统的bug 问题 通过测试,找出了系统中存在的较多bug...... 体会 测试太重要了,很多原本以为没什么bug,一测就能找到好几个,而且改个bug真 ...

  5. Spark 基础 —— 创建 DataFrame 的三种方式

    1.自定义 schema(Rdd[Row] => DataSet[Row]) import org.apache.spark.sql.types._ val peopleRDD = spark. ...

  6. Vue --- 前后台总结

    请求生命周期: 1.先请求路由,在去替换APP.vue中的router-views 2.@表示src 3.加载全局css: require('@/assets/....') 4.获取当前路由 this ...

  7. TypeScript语言学习笔记(4)枚举

    枚举 // 数值型枚举 enum Direction { Up = 1, Down, Left, Right, } // Up=0 enum Direction { Up, Down, Left, R ...

  8. Parametric and Nonparametric Algorithms

    即参数化算法和非参数化算法. 参数化机器学习算法 可以大大简化学习过程,也可以限制可以学到的东西,将函数简化为已知形式的算法称为参数化机器学习算法.算法包括两个步骤: 为函数选择一个form. 从训练 ...

  9. linux 出错 “INFO: task java: xxx blocked for more than 120 seconds.” 的3种解决方案

    1 问题描述 最近搭建的一个linux最小系统在运行到241秒时在控制台自动打印如下图信息,并且以后每隔120秒打印一次. 仔细阅读打印信息发现关键信息是“hung_task_timeout_secs ...

  10. webuploader之大文件分段上传、断点续传

    文件夹数据库处理逻辑 public class DbFolder { JSONObject root; public DbFolder() { this.root = new JSONObject() ...