Vue中使用echarts,ajax请求的远程数据赋值给图表不刷新的问题和解决办法
问题:
vue-cli搭建的项目,在mounted钩子函数里面创建echarts图表,本地模拟数据可以正常显示,但是当将ajax请求的远程数据赋值给图表时,图表并不会刷新。
解决办法:
刚开始以为是vue绑定的数据没有绑定成功,查找资料后发现并不是vue的问题,而是echarts的问题,echarts的数据发生改变时并不会自动刷新,而是需要重新创建这个图表,于是将图表创建部分封装成一个函数,在mounted请求到远程数据后调用这个函数,并将参数以形参的方式传给函数,这样函数图标创建时的数据就是更新后的数据了,再以这个新数据创建图表就能达到理想的效果了。
Vue中使用echarts,ajax请求的远程数据赋值给图表不刷新的问题和解决办法的更多相关文章
- Vue中如何使用axios请求跨域数据
1.axios不支持jsonp,因为axios的作者觉得jsonp不太友好,推荐用CORS方式更为干净: 2.在使用axios发送请求时,服务器端设置 res.header("Access- ...
- 在vue中调用echarts中的地图散点图~
首先!当然是在vue中引入echarts! 命令行 npm install echarts --save 在main.js文件中里引入 import echarts from 'ech ...
- vue中采用axios发送请求及拦截器
这几天在使用vue中axios发送get请求的时候很顺手,但是在发送post请求的时候老是在成功的回调函数里边返回参数不存在,当时就纳闷了,经过查阅资料,终于得到了解决方案,在此做一总结: 首先我们在 ...
- vue中使用echarts(vue+vue-cli+axios+jsonp+echarts)
一.安装echarts: cnpm i echarts -D 二.在vue-cli的main.js文件中引用echarts: import charts from 'echarts' Vue.prot ...
- 在vue中使用echarts图表
在vue中使用echarts图表 转载请注明出处:https://www.cnblogs.com/wenjunwei/p/9815290.html 安装vue依赖 使用npm npm instal ...
- Vue中使用ECharts画散点图加均值线与阴影区域
[本文出自天外归云的博客园] 需求 1. Vue中使用ECharts画散点图 2. 在图中加入加均值线 3. 在图中标注出阴影区域 实现 实现这个需求,要明确两点: 1. 知道如何在vue中使用ech ...
- ajax请求回数组数据,Vue页面数组没同步问题
记录bug 为什么 ajax 获取到了 vm.$data.list 页面上却没有显示出来的? 代码 //页面 <tr v-for="item in list">{{ * ...
- React 中的 AJAX 请求:获取数据的方法
React 中的 AJAX 请求:获取数据的方法 React 只是使用 props 和 state 两处的数据进行组件渲染. 因此,想要使用来自服务端的数据,必须将数据放入组件的 props 或 st ...
- 记录下vue 中引用echarts 出现 "TypeError: Cannot read property 'getAttribute' of undefined"问题
今天做项目,用echarts展示数据 ,自己测试 先测试 了下.写的代码html: <div ref="myChart" style="height:300px;w ...
随机推荐
- 那些被刻意“阉割”的名人名言
"天才是百分之一的灵感,百分之九十九的汗水",这句名言大家都知道的吧!不过还有好多人不知道的是这句名言还有后半句:"但百分之一的灵感甚至比百分之九十九的汗水更重要.&qu ...
- 吴裕雄--天生自然 PHP开发学习:PhpStorm的配置与安装
下载安装包
- JAVA如何判断两个字符串是否相等
==比较引用,equals 比较值 1.java中字符串的比较:== 我们经常习惯性的写上if(str1==str2),这种写法在java中可能会带来问题 example1: String a=&qu ...
- Java中的成员内部类
*/ * Copyright (c) 2016,烟台大学计算机与控制工程学院 * All rights reserved. * 文件名:text.java * 作者:常轩 * 微信公众号:Worldh ...
- JavaScript中如何给按钮设置隐藏与显示属性
*/ * Copyright (c) 2016,烟台大学计算机与控制工程学院 * All rights reserved. * 文件名:text.html * 作者:常轩 * 微信公众号:Worldh ...
- 达拉草201771010105《面向对象程序设计(java)》第十七周学习总结
达拉草201771010105<面向对象程序设计(java)>第十七周学习总结 第一部分:理论知识 1.多线程的概念: (1)多线程是进程执行过程中产生的多条执行线索. (2)多线程意味着 ...
- sql -- update表子查询、多条件判断case when
表结构: 需求 思路: 求出平均数 select avg(user_total) as avg from user_level 更新他的等级 update user_level set user_ra ...
- Dart的JIT 与 AOT
JIT:Just In Time AOT:Ahead of Time 含义: 目前,程序主要有两种运行方式:静态编译与动态解释. 静态编译的程序在执行前全部被翻译为机器码,通常将这种类型称为AOT ( ...
- java反序列化-ysoserial-调试分析总结篇(6)
前言: 这篇记录CommonsCollections6的调试,外层也是新的类,换成了hashset,即从hashset触发其readObject(),yso给的调用链如下图所示 利用链分析: 首先在h ...
- MySql5.7.28下载、安装、登陆详解
进入MySql官网下载,页面如下 根据自己需求,选择适合自己的进行下载 然后解压安装包到自己的喜欢的路径 配置环境变量 添加环境系统变量 MYSQL_HOME:D:\Program Files\mys ...