Google翻訳を使用したサイトのマルチ言語サポートの作成React js

Question

単純なhtmlプロジェクトでは、このリンクを簡単に参照できます。

https://www.w3schools.com/howto/howto_google_translate.asp

しかし、私は中に実装しようとしているアプリを反応させます。だから私は反応アプリでコードを複製することができません。

componentDidMount() { 
    googleTranslateElementInit(() => { 
    new google.translate.TranslateElement({pageLanguage: 'en'}, 'google_translate_element'); 
    }); 
    const script = document.createElement("script"); 
    script.src = "//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"; 
    script.async = true; 
    document.body.appendChild(script); 
} 

レンダリング要素。

render() { 
    return (
     <div id="google_translate_element"></div> 
    ); 
    } 

これは、Google、googleTranslateElementInitが定義されていないと言って私にエラーを示しています。

反応アプリでGoogle翻訳を使用するにはどうすればよいですか？ サイト全体を翻訳できるnpmパッケージもありますか？

おかげ

Answer 1

は、Googleがあなたのプロジェクトのルート index.htmlにスクリプトを変換する移動

。

ただし、ご希望の場所に以下のコードを残す必要があります。

render() { 
    return (
     <div id="google_translate_element"></div> 
    ); 
    } 

修正問題を簡単に。