Retornar dados API em React free.currconv

Olá tento retornar o resultado da API mas da erro undefined
no console aparece: Access to fetch at ‘https://free.currconv.com/api/v7/convert?q=undefined_undefined&compact=ultra&apiKey=234428564665e4c14ce2’ from origin ‘http://localhost:3000’ has been blocked by CORS policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource. If an opaque response serves your needs, set the request’s mode to ‘no-cors’ to fetch the resource with CORS disabled.

import React, { Component } from ‘react’;

export default class Conversor extends Component {

constructor(props) {
    super(props);

    this.state = {
        moedaA_valor: "", 
        moedaB_valor: 0,
    };

    this.converter = this.converter.bind(this);
     {/*Para acessar o This do metodo converter, precisa por o metodo 
    bind.Toda função do Js tem esse método bind, pode passar algum objeto
    par dento do bind e ele se torna o this */} 
}

 
converter() {
    
    let de_para = `${this.props.moedaA_valor}_${this.props.moedaB_valor}`;
    let url = `https://free.currconv.com/api/v7/convert?q=${de_para}&compact=ultra&apiKey=234428564665e4c14ce2`;

    fetch(url)
    .then(res=>{
        
        return res.json()
        
    })
    .then(json=>{
        let cotacao = json(de_para).val
        ;
        let moedaB_valor = ( parseFloat(this.state.moedaA_valor) * cotacao).toFixed(2)
        this.setState({moedaB_valor})
    })

}

render() {
return (

{this.props.moedaA} para {this.props.moedaB}

{this.setState({moedaA_valor:event.target.value})}}>
{/* disparar evento no botton. onChange vai pegar o valor(disparar evento),
o evento vai pegar o elemento (target) que é o que foi desccrito na caixa (elemento input)
pegando o valor informado(value)/}

{/ criou evento (onclick) qie vai chamar a função,metodo (converter)*/}

{this.state.moedaB_valor}

  </div>
);

}
}