Javascript 在HTML中没有重定向的情况下更改语言的正确方法是什么？

我是网络开发新手，我的任务是在不改变网页的情况下改变网站的语言。（例如，英语为somesite.com/en/home，日语为somesite.com/jp/home等）。我想我已经想出了一种使用React的方法，但我不确定这种改变语言的方法是否自然、有效。下面是我在React.js中的代码

import React from 'react'
import metadata from './metadata'

class Display extends React.Component
{
    constructor()
    {
        super()
        this.state = {l: metadata[0]}
        this.handleLanguageChange = this.handleLanguageChange.bind(this)
    }

    handleLanguageChange()
    {
        let lang = event.target.value;
        if(lang == 'ta')
            this.setState({l: metadata[0]})
        else if(lang == 'en')
            this.setState({l: metadata[1]})
        else if(lang == 'jp')
            this.setState({l: metadata[2]})
        else if(lang == 'zh')
            this.setState({l: metadata[3]})
    }

    render()
    {
        return(
            <div>
               <select onChange={this.handleLanguageChange}>
                    <option value="ta">Tamil</option>
                    <option value="en">English</option>
                    <option value="jp">Japanese</option>
                    <option value="zh">Chinese</option>
               </select>
               <h1>{this.state.l.language}</h1>
               <h2>{this.state.l.title}</h2>
               <p>{this.state.l.content}</p>
            </div>
        )
    }
}

export default Display

还有index.js

import React from 'react';
import ReactDOM from 'react-dom'
import Display from './Display'

ReactDOM.render(<Display />, document.getElementById('root'));

从“React”导入React；
从“react dom”导入react dom
从“./Display”导入显示
ReactDOM.render（，document.getElementById（'root'））；

当我测试它时，它像做梦一样工作。但这种方法正确吗？这会不会构成任何安全威胁

---

请给我指引正确的方向。

你的方法很好，可能是每个人都在使用的方法

需要注意的是，如果您使用没有“全局”状态/存储策略的prop或state变量，那么用新文本刷新页面可能不容易

试着考虑使用“上下文”将此语言转换为一个更“全局”的变量，以便与您的任何组件一起本地使用。这样，您就不必担心传递这个变量，也可以使用单独的作用域来更改这个变量

---

这在一开始并不明显，但当您扩展代码库时，您会意识到当前的解决方案无法扩展

我不会重新发明轮子，所以你是说你会在每个组件中包含所有支持语言的所有文本？发布的代码实际上没有任何作用。@Pointy此代码根据下拉框中的选择更改内容。@KishorePrabhu是的，我理解。如果你有一个完整的应用程序呢？@KishorePrabhu，我当然希望如此。”可能每个人都在使用相同的方法“嗯，不在这里。我可以使用cookies让我的程序使用以前的语言，对吗？

Keep json file each for all languages and then you can do like this:

    import english from './locales/english.json'

    handleLanguageChange()
        {
            let lang = event.target.value;
            if(lang == 'english')
                this.setState({stateOfLocale: 'english'});
                I18n.locale = stateOfLocale;
            ...
        }       

Keep json file each for all languages and then you can do like this:

    import english from './locales/english.json'

    handleLanguageChange()
        {
            let lang = event.target.value;
            if(lang == 'english')
                this.setState({stateOfLocale: 'english'});
                I18n.locale = stateOfLocale;
            ...
        }