0
ボタンをクリックして言語をドイツ語または英語に変更できるReact Webサイトを作成します。私は反応し、まだ学ぶのが初めてです。ボタンをクリックしたときに反応コンポーネントの内容を変更する（異なる言語）
私はこのようになりますシンプルなJSON作成：私はonClickのをとき、その状態をトグルボタンを作成し
{
"de": {
"header": "Willkommen",
"footer": "Auf Wiedersehen"
},
"eng": {
"header": "Welcome",
"footer": "Goodbye"
}
}
を。しかし、私はどこにでもアクセスしたいなら、国家がこれをするのは間違った方法だと私は思う。
class Button extends React.Component {
constructor(props) {
super(props);
this.state = {isOn: true};
this.handleClick = this.handleClick.bind(this);
}
handleClick() {
if (this.state.isOn) {
this.setState({isOn: false})
} else {
this.setState({isOn: true})
}
}
render() {
return(
<button type="button" onClick={this.handleClick}>DE/ENG{JSON.stringify(this.state.isOn)}</button>
);
}
}
これで、JSONデータをインポートして、コンポーネントに適切なデータを挿入します。ここのこの1つは機能しません。私はそれをする方法を知らない。ボタンをクリックすると、すべてのコンポーネントがドイツ語または英語のデータを取得する必要があります。私は多くのコンポーネントでそれを使いたいと思っています。
import DATA from './data.json';
class Main extends React.Component {
render() {
const data = Button.state.isOn ? DATA.de : DATA.eng;
return (
<div>
<Button onIsOnChange={this.buttonChange} />
<span>{data.header}</span>
</div>
);
}
}
をあなたがこれを行う方法を知っています（私が、たとえばconst型データ= DATA.deを使用しますが、私はボタンをクリックすると、そのコンテンツは変更されません。とき働いていますか）？