<div id="quotesWidgetConverter"></div>
<div class="qw-copyright"><a href="https://www.mql5.com/?utm_source=quotes.widget&utm_medium=link&utm_term=quotes.converter&utm_content=visit.mql5.quotes&utm_campaign=quotes.converter.widget" rel="noopener nofollow" target="_blank">MQL5 Algo Trading Community</a></div>
<script async type="text/javascript" data-type="quotes-widget" src="https://c.mql5.com/js/widgets/quotes/widget.js?v=3">
{"type":"converter","filter":"EURUSD","datepicker":true,"details":true,"extras":["USD","EUR","GBP","JPY","CHF","CNH","CAD","AUD","SGD","SEK","RUB"],"width":580,"height":340,"id":"quotesWidgetConverter","fw":"html"}
</script>
// QuotesWidgetConverter.jsx
import { useEffect, useRef, memo } from 'react';
function QuotesWidgetConverter() {
const container = useRef();
useEffect(() => {
const script = document.createElement('script');
script.src = 'https://c.mql5.com/js/widgets/quotes/widget.js?v=3';
script.type = 'text/javascript';
script.async = true;
script.dataset.type = 'quotes-widget';
script.innerHTML = `{"type":"converter","filter":"EURUSD","datepicker":true,"details":true,"extras":["USD","EUR","GBP","JPY","CHF","CNH","CAD","NOK","AUD","SGD","NZD","SEK","RUB","ZAR"],"width":580,"height":340,"id":"quotesWidgetConverter","fw":"react"}`;
container.current?.appendChild(script);
}, []);
return (
<div ref={container}>
<div id="quotesWidgetConverter"></div>
<div className="qw-copyright"><a href="https://www.mql5.com/?utm_source=quotes.widget&utm_medium=link&utm_term=quotes.converter&utm_content=visit.mql5.quotes&utm_campaign=quotes.converter.widget" rel="noopener nofollow" target="_blank">MQL5 Algo Trading Community</a></div>
</div>
);
}
export default memo(QuotesWidgetConverter);
<!-- QuotesWidgetConverter.svelte -->
<script>
import { onMount } from 'svelte';
let container;
onMount(() => {
const script = document.createElement('script');
script.src = 'https://c.mql5.com/js/widgets/quotes/widget.js?v=3';
script.type = 'text/javascript';
script.async = true;
script.dataset.type = 'quotes-widget';
script.innerHTML = `{"type":"converter","filter":"EURUSD","datepicker":true,"details":true,"extras":["USD","EUR","GBP","JPY","CHF","CNH","CAD","NOK","AUD","SGD","NZD","SEK","RUB","ZAR"],"width":580,"height":340,"id":"quotesWidgetConverter","fw":"svelte"}`;
container.appendChild(script);
return () => {
if (script.parentNode) {
script.remove();
}
};
});
</script>
<div bind:this={container}>
<div id="quotesWidgetConverter"></div>
<div class="qw-copyright"><a href="https://www.mql5.com/?utm_source=quotes.widget&utm_medium=link&utm_term=quotes.converter&utm_content=visit.mql5.quotes&utm_campaign=quotes.converter.widget" rel="noopener nofollow" target="_blank">MQL5 Algo Trading Community</a></div>
</div>
<!-- QuotesWidgetConverter.vue -->
<script setup>
import { onMounted, ref } from 'vue';
const container = ref(null);
onMounted(() => {
if (!container.value) return;
const script = document.createElement('script');
script.src = 'https://c.mql5.com/js/widgets/quotes/widget.js?v=3';
script.type = 'text/javascript';
script.async = true;
script.dataset.type = 'quotes-widget';
script.innerHTML = `{"type":"converter","filter":"EURUSD","datepicker":true,"details":true,"extras":["USD","EUR","GBP","JPY","CHF","CNH","CAD","NOK","AUD","SGD","NZD","SEK","RUB","ZAR"],"width":580,"height":340,"id":"quotesWidgetConverter","fw":"vue"}`;
container.value.appendChild(script);
});
</script>
<template>
<div ref="container">
<div id="quotesWidgetConverter"></div>
<div class="qw-copyright"><a href="https://www.mql5.com/?utm_source=quotes.widget&utm_medium=link&utm_term=quotes.converter&utm_content=visit.mql5.quotes&utm_campaign=quotes.converter.widget" rel="noopener nofollow" target="_blank">MQL5 Algo Trading Community</a></div>
</div>
</template>
