1 回答

TA貢獻1911條經(jīng)驗 獲得超7個贊
首先確保您有一個可用的 CDN(因為您需要 CDN),例如trading-vue:
<script src="https://cdn.jsdelivr.net/npm/trading-vue-js@0.9.0/dist/trading-vue.min.js"></script>
無論您想在何處使用它,請在父components選項中注冊組件定義:
components: {
trading: TradingVueJs.TradingVue // Naming it 'trading'
}
給家長一些數(shù)據(jù):
data() {
return {
mydata: {
ohlcv: [ // Taken from their docs, this name seems to be important
[ 1551128400000, 33, 37.1, 14, 14, 196 ],
[ 1551132000000, 13.7, 30, 6.6, 30, 206 ],
[ 1551135600000, 29.9, 33, 21.3, 21.8, 74 ],
[ 1551139200000, 21.7, 25.9, 18, 24, 140 ],
[ 1551142800000, 24.1, 24.1, 24, 24.1, 29 ],
]
}
}
},
將該數(shù)據(jù)作為 prop 傳遞:
<div id="app">
<trading :data="mydata"></trading>
</div>
這是一個演示:
/***** APP *****/
new Vue({
el: "#app",
data() {
return {
mydata: {
ohlcv: [
[ 1551128400000, 33, 37.1, 14, 14, 196 ],
[ 1551132000000, 13.7, 30, 6.6, 30, 206 ],
[ 1551135600000, 29.9, 33, 21.3, 21.8, 74 ],
[ 1551139200000, 21.7, 25.9, 18, 24, 140 ],
[ 1551142800000, 24.1, 24.1, 24, 24.1, 29 ],
]
}
}
},
components: {
trading: TradingVueJs.TradingVue
}
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div id="app">
<trading :data="mydata"></trading>
</div>
<script src="https://cdn.jsdelivr.net/npm/trading-vue-js@0.9.0/dist/trading-vue.min.js"></script>
添加回答
舉報