在不重新加载页面的情况下更改类似facebook的按钮语言

change facebook like button language without reloading page

本文关键字：情况下 语言 按钮 facebook 新加载 加载      更新时间：2023-11-27

我正在使用ReactJS来构建我的网站，上面有一个语言切换。我在英语和法语之间切换，而无需重新加载页面，只需安装一组新的ReactJS组件。

我的一个组件上有一个FacebookLIKE按钮，但因为facebookjssdk是独立于组件结构加载的，所以它被锁定在最先加载的语言中。

有没有一种方法可以让我在不重新加载页面的情况下更改加载的facebookjssdk的语言？

@trekforever：事实上，在我看到你的评论之前，我昨晚就这么做了！

这是我的最终解决方案：

componentWillMount: function(){
    // check for a fb-like button and remove it
    // if it exists!
    if( window.FB ) {
        // remove all instances of facebook and elements
        $("#facebook-jssdk, #fb-root").remove()
        delete window.FB
    }
    // we need to use this method to let facebook-jssdk
    // know it needs to parse the xfbml after it loads
    // into our page
    window.fbAsyncInit = function() {
        window.FB.init({
            xfbml      : true,
            version    : 'v2.0'
        });
    };
    // we don't have to go through all the checks and balances that
    // come in the fb jssdk init code by default, we just got rid of them
    var fjs = document.getElementsByTagName('script')[0],
        js = document.createElement('script')
        js.id = 'facebook-jssdk'
        js.src = '//connect.facebook.net/en_US/sdk.js'
    fjs.parentNode.insertBefore(js, fjs)
}

我的第二语言是fr_CA，所以我只替换了这一行：

js.src = '//connect.facebook.net/en_US/sdk.js'

这个：

js.src = '//connect.facebook.net/fr_CA/sdk.js'

现在我可以用任何一种（或任何一种）语言重新渲染组件，它也会用正确的语言向我显示一个类似Facebook的按钮！

出于兴趣，这里是同样的事情，但谷歌的Recaptcha:

componentWillMount: function(){
    // this is stolen directly from the facebook-jssdk
    // implementation...
    if( window.grecaptcha ){
        $("#grecaptcha-jssdk").remove()
        delete window.grecaptcha
    }
    var gjs = document.getElementsByTagName('script')[0],
        js = document.createElement('script')
    js.id = 'grecpatcha-jssdk'
    js.src = 'https://www.google.com/recaptcha/api.js?hl=fr-CA'
    gjs.parentNode.insertBefore(js, gjs)
}

默认情况下，它的名称不是grecaptcha-jssdk，我只是为了保持一致性而选择了使用这个名称。

i18n快乐！

相关文章：