i8следующий с nextjs не переводится при отображении данных - PullRequest
Новая
       7

i8следующий с nextjs не переводится при отображении данных

0 голосов
/ 05 декабря 2018

У меня проблема с выяснением того, как обрабатывать переводы при отображении данных с помощью i18next.Кажется, не получается заставить работать переменные, и из-за функции карты, если я вызываю любой перевод из locales, он, кажется, отображает его для всех элементов, даже если ключ установлен на cause.id.

Beenглядя на следующие функции перевода, чтобы помочь.Но может показаться, чтобы понять это.https://www.i18next.com/translation-function/essentials

У меня следующая структура: 

components/
models/causes.json
pages/Home.js
pages/_document.js
static/
    images/
    locales/
        en/
        dk/
styles/
server.js

Вот моя главная страница страниц 

import React, { Component } from 'react';
import Router, { withRouter } from 'next/router';
import Link from 'next/link';

import causes from '../models/causes';

import { withNamespaces } from '../i18n';
import i18n from "i18next";
import { reactI18nextModule } from "react-i18next";

i18n
  .use(reactI18nextModule)
  .init({
    fallbackLng: "en",
    load: "languageOnly",
    ns: ["common"],
    defaultNS: "common",
    react: {
      wait: true,
      nsMode: "default"
    }
});

class Home extends Component {
  static async getInitialProps({ req, res }) {
    return { causes }
  }

  render() {
    const { router, causes } = this.props;
    const causeId = router.query.causeId;
    const cause = causes.find((cause) => {
      if (cause.id === causeId) {
        return cause;
      }
    });

    return (
      <>
        <div className="appContainer">

          <h1>{this.props.t('heading')}</h1>

          {causes.map((cause) => (
            <div key={cause.id}>
              <h4>{this.props.t('cause-type', cause.type)}</h4>
              <h2>{cause.title}</h2>
              <p>{cause.desc}</p>
            </div>
          ))}

        </div>
      </>
    );
  }
}

export default withNamespaces('common')(Home)

Вот моя конфигурация i18следующая: 

const NextI18Next = require('next-i18next').default
module.exports = new NextI18Next({ otherLanguages: ['en', 'de', 'dk', 'jp', 'kr'] })

Вот мой server.js 

const express = require('express')
const next = require('next')
const { nextI18NextMiddleware } = require('./i18n')

const app = next({ dev: process.env.NODE_ENV !== 'production' })
const handle = app.getRequestHandler();

(async () => {
  await app.prepare()
  const server = express()

  nextI18NextMiddleware(app, server)

  server.get('*', (req, res) => handle(req, res))

  await server.listen(3000)
  console.log('> Ready on http://localhost:3000')
})()
...