javascript - this.props.t 不是函数，{this.props.t('Welcome to React')} react.i18next 改变语言

Question

尝试使用按钮进行语言切换。我使用react-i18next框架。在 console.log 我有错误this.props.t is not a function, {this.props.t ('Welcome to React')}

行错误：{this.props.t ('Welcome to React')}

这里的所有代码：https ://stackblitz.com/edit/react-gcbxwe?file=Form.jsx

index.js

import React, { Component } from 'react';
import { render } from 'react-dom';
import Form from "./form/Form.jsx";
import './i18n';
import i18n from './i18n';
import { withNamespaces } from 'react-i18next';

render(
  <Form/>,
  window.document.getElementById("root")
);

表单.js

import React, { Component } from 'react';
import Todos from './Todos';

class Form extends Component {
  constructor (props) {
    super(props);
    this.state = {
      token: '',
      todos: []
    }
  }
  render () {
    const changeLanguage = (lng) => {
        i18n.changeLanguage(lng);
    }

    return (
        <div>
            {this.state.token ?
            <Todos
                todos={this.state.todos}
            /> 
            :    
            <form  action="" method="post" autoComplete="off">
                <div>
                    <button onClick={() => changeLanguage('de')}>de</button>
                    <button onClick={() => changeLanguage('en')}>en</button>
                    <h1>{this.props.t('Welcome to React')}</h1>
                </div>
                <h2>Log in</h2>           
                <div>
                    <label htmlFor="email">email</label>
                    <input type="email" required className="form-control formControlEmail" name="email"
                    placeholder="Email"
                    value={this.state.email}
                    onChange={this.handleUserInput}  />
                </div>>
                <button type="submit" value="Submit" className="btn btn-primary btn-block btnLogin">Log in</button>
            </form>            
            }
        </div>
    )
  }
}

export default withNamespaces()(Form);