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

vue 手动/局部刷新组件

阅读量：787 次

发布时间：2019-03-24

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

使用场景

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

实现方案

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

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

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

完整的范例代码

父组件：

子组件 test1：

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

你可能感兴趣的文章

Qt开发——多线程网络时间客户端

PostgreSQL学习总结（13）—— PostgreSQL 15.8 如何成就数据库性能王者？

PostgreSQL学习总结（13）—— PostgreSQL 目录结构与配置文件 postgresql.conf 详解

PostgreSQL学习总结（1）—— PostgreSQL 入门简介与安装

PostgreSQL学习总结（2）—— PostgreSQL 语法

PostgreSQL学习总结（3）—— PostgreSQL 数据类型

Qt开发——圆面积计算器

PostgreSQL学习总结（5）—— PostgreSQL table 创建与删除

PostgreSQL学习总结（6）—— PostgreSQL 模式（SCHEMA）详解

PostgreSQL学习总结（7）—— PostgreSQL 语句 INSERT INTO、SELECT、UPDATE、DELETE 等学习

PostgreSQL学习总结（8）—— PostgreSQL 基于数据库和基于模式（schema）的多租户分析

PostgreSQL学习总结（9）—— PostgreSQL 运算符与表达式

PostGreSql学习笔记001---PostgreSQL10.4安装（Windows）_支持PostGreGis_PostJDBC

PostGreSql学习笔记002---Navicat Premium中管理PostGreSql 错误:字段rolcatupdate 不存在

PostgreSQL学习笔记：PostgreSQL vs MySQL

PostgreSQL实现shape数据转geojson数据（地图工具篇.18）

PostgreSQL导入shape数据（地图工具篇.10）

PostGreSql工作笔记003---在Navicat中创建数据库时报错rolcatupdate不存在_具体原因看其他博文_这里使用pgAdmin4创建管理postgre

PostGreSql工作笔记004---PostGreSql修改密码_windows和linux下修改

Postgresql常用命令行操作_以及Navicat操作PostGis时的问题_自动截取长度_WKB structure does not match exp---PostgreSQL工作笔记005