有关调用接口动态获取dataV里面水位图数据

在我们使用datav框架里面水位图组件时,调用接口获取数据的时候,没有渲染上去,而且控制台不报错,这时我们要注意,datav框架中不具有改变在vue中数据的能力,所以在datav中水位图里面的config数据用扩展运算符...重新赋值进去即可。

          const { config } = [response.data[1].monitorValue]

          that.config = { ...that.config}

          console.log(config);

  • 1
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
首先,你需要在 `vue` 项目中引入 `echarts` 的库文件,可以通过 `npm` 安装,也可以直接在 `index.html` 中引入 `echarts` 的 CDN 地址。 接下来,你可以在 `vue` 组件中使用 `echarts` 的 `tree` 图表,然后在 `option` 中配置相应的数据和交互事件。以下是一个示例代码: ```html <template> <div class="echarts-tree" ref="echartsTree" style="height: 500px"></div> </template> <script> import echarts from 'echarts' export default { data() { return { chartData: { // echarts tree 数据 // ... } } }, mounted() { // 初始化 echarts const myChart = echarts.init(this.$refs.echartsTree) // 配置 echarts tree 图表 const option = { // echarts tree 配置项 // ... } // 绑定 echarts tree 的点击事件 myChart.on('click', (params) => { // 获取点击的节点 const node = params.data // 调用接口获取下一节点数据 // ... // 更新 echarts tree 数据 // ... // 重新渲染 echarts tree myChart.setOption(option) }) // 渲染 echarts tree myChart.setOption(option) } } </script> ``` 在上面的代码中,我们首先在 `mounted()` 钩子函数中初始化了 `echarts`,并创建了一个 `tree` 图表。然后,我们在配置项 `option` 中设置了一些默认的数据和交互事件。接着,我们绑定了 `echarts` 的 `click` 事件,当用户点击某个节点时,会触发该事件,并获取点击的节点数据,然后调用接口获取下一节点的数据,并更新 `echarts tree` 的数据,最后重新渲染 `echarts tree`。 以上是一个简单的 `echarts tree` 的实现示例,具体的实现方式可以根据你的项目需求进行调整。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值