vue使用tradingview生成k线图（第一天）
网上很多项目运行的时候没有问题，但是拷贝到自己的vue最新版里面去，就要报很多错误，一般情况都是因为创建k线图的时候配置有问题，这里我已经处理兼容新版vue的资源，需要的可以下载。链接：https://download.csdn.net/download/qq_42740797/20372015下载后的目录结构如图：步骤一、引入js。“custom_scripts”是k线图相关的js文件，vue项
这个版本可能可能有问题，请使用第二版，文章链接：
vue 使用tradingview修改主题色等等配置（第二天）_草字的博客-CSDN博客_tradingview 修改主题颜色
网上很多项目运行的时候没有问题，但是拷贝到自己的vue最新版里面去，就要报很多错误，一般情况都是因为创建k线图的时候配置有问题，这里我已经处理兼容新版vue的资源，需要的可以下载。
链接：
tradingview整合资源.rar_tradingview文档-以太坊文档类资源-CSDN下载
下载后的目录结构如图：
步骤一、引入js。
“custom_scripts”是k线图相关的js文件，vue项目需要放在“public”文件夹下，然后在public下的index.html文件中引入js。相关代码：
<!DOCTYPE html>
<html lang="">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
<title><%= htmlWebpackPlugin.options.title %></title>
<script type="text/javascript" src='<%= BASE_URL %>/custom_scripts/chart_main/charting_library.min.js'></script><!--核心代码-->
</head>
<body>
<div id="app"></div>
</body>
</html>步骤二、使用组件。
“tradingview”文件是一个组件，可以放在“components”目录下，其他地方引入后直接就可以使用了。参考目录：
步骤三、最后，效果：
其他版本常见错误：
1.contentWindow.widgetReady is not function。//配置有问题。
2.如果没有报错，但是k线图也没有线图，多半是“charting_library.min.js”下的如下代码：
window.addEventListener("DOMContentLoaded", t, !1)vue最新版项目，兼听不到“DOMContentLoaded”dom加载的这个事件，也就不会触发onReady回调了，需要将其事件改为“load”。
window.addEventListener("load", t, !1)附上相关链接：
最新版文档：初识tradingview - 来亦何哀 - 博客园
tradingview官网：https://cn.tradingview.com/lightweight-charts/
tradingview官方文档：4-5、功能集 - TradingView 中文开发文档
1.图表相关配置开发文档：
3-1、如何连接我的数据 · TradingView中文开发文档
2.比较好的项目（不兼容最新版vue哈）：
https://github.com/webdatavisualdev/vue-tradingview
3.推荐博客：
前往低代码交流专区
更多推荐
3
0- 0
已为社区贡献25条内容
所有评论(0)