vue 手动/局部刷新组件-白红宇

vue 手动/局部刷新组件

阅读量：787 次

发布时间：2019-03-24

本文共 275 字，大约阅读时间需要 1 分钟。

使用场景

当需要在点击按钮或某变量发生变化时，在不刷新整个页面的情况下，局部刷新（重绘）图表或重新加载子组件时，以下方案可以有效实现。

实现方案

在需要局部刷新的组件上，可以通过以下方式实现：

在组件的data选项中，将show的默认值设置为true，以便第一次渲染时组件能够正常显示。

当点击事件发生时，首先将show变量设置为false，随后在this.$nextTick周期中，将show变量设置回true。这样可以在不触发浏览器刷新的情况下，重新渲染目标组件。

完整的范例代码

父组件：

子组件 test1：

转载地址：http://sqmkk.baihongyu.com/

你可能感兴趣的文章

mysql 存在update不存在insert

Mysql 学习总结（86）—— Mysql 的 JSON 数据类型正确使用姿势

Mysql 学习总结（87）—— Mysql 执行计划（Explain）再总结

Mysql 学习总结（88）—— Mysql 官方为什么不推荐用雪花 id 和 uuid 做 MySQL 主键

Mysql 学习总结（89）—— Mysql 库表容量统计

mysql 实现主从复制/主从同步

mysql 审核_审核MySQL数据库上的登录

mysql 导入 sql 文件时 ERROR 1046 (3D000) no database selected 错误的解决

mysql 导入导出大文件

mysql 将null转代为0

MySQL 常用列类型

mysql 常用命令

Mysql 常见ALTER TABLE操作

mysql 往字段后面加字符串

mysql 快速自增假数据，新增假数据，mysql自增假数据

Mysql 报错 Field 'id' doesn't have a default value

MySQL 报错：Duplicate entry 'xxx' for key 'UNIQ_XXXX'

mysql 排序id_mysql如何按特定id排序

Mysql 提示：Communication link failure