Question

我不知道该在这里还是在其他地方问一个问题，但是我正在使用tradingview库，该库对我有用，但对我不起作用。

根据文档，我将代码放入脚本标签下的Vue中的index.html文件中，并且我的tradingview工作，但是我想将此代码放入mounted下，但是我得到了错误：

安装的挂钩中出现错误：“ ReferenceError：未定义TradingView”

以下是index.html文件中有效的代码示例：

<script type="text/javascript" src="/charting_library/charting_library.min.js"></script>
<script type="text/javascript" src="https://d33t3vvu2t2yu5.cloudfront.net/tv.js"></script>
<script>

function getParameterByName(name) {
name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]");
var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"),
results = regex.exec(location.search);
return results === null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
}

TradingView.onready(function() {
  var widget = new TradingView.widget({
    symbol: 'Bitfinex:ETHUSD',
    interval: '30',
    theme: 'Dark',
    style: '1',
    container_id: "tv_chart_container",
    library_path: "/charting_library/",
    locale: getParameterByName('lang') || "en",
    width: '100%',
    height: '600px',
    debug: false,
    preset: "mobile"
  });

}）

这是我的vue文件中挂载的代码：

mounted () {
TradingView.onready(function() {
  new TradingView.widget({
    symbol: 'Bitfinex:ETHUSD',
    interval: '30',
    theme: 'Dark',
    style: '1',
    container_id: "tv_chart_container",
    library_path: "/charting_library/",
    locale: this.getParameterByName('lang') || "en",
    width: '100%',
    height: '600px',
    debug: false,
    preset: 'mobile'
  })
})
}

有人知道为什么这里没有定义TradingView吗？

Answer 1

您缺少使用vue脚本，因此请按如下所示添加它：

    <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.16/vue.js"></script>

检查此工作代码：

new Vue({
  el: '#app',

  data() {
    return {
   
     
     }
  },
 mounted () {
TradingView.onready(function() {
  new TradingView.widget({
    symbol: 'Bitfinex:ETHUSD',
    interval: '30',
    theme: 'Dark',
    style: '1',
    container_id: "tv_chart_container",
    library_path: "/charting_library/",
    locale: this.getParameterByName('lang') || "en",
    width: '100%',
    height: '600px',
    debug: false,
    preset: 'mobile'
  })
})
}
  });

<script type="text/javascript" src="/charting_library/charting_library.min.js"></script>
<script type="text/javascript" src="https://d33t3vvu2t2yu5.cloudfront.net/tv.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.16/vue.js"></script>
<script>

function getParameterByName(name) {
name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]");
var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"),
results = regex.exec(location.search);
return results === null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
}

</script>
<div id="app">
</div>

Answer 2

如果有人会遇到相同的问题，那么对我来说 setTimeout 就可以了。这是代码：

mounted () {
  setTimeout(function() {
   // TradingView code
  }, 1000)
}

在Vue安装的挂钩中未定义TradingView

2 个答案: