Skip to content

Instantly share code, notes, and snippets.

@DevanB
Created December 2, 2018 21:04
Show Gist options
  • Save DevanB/54667958575fa4a2a6c83aae0d273fb8 to your computer and use it in GitHub Desktop.
Save DevanB/54667958575fa4a2a6c83aae0d273fb8 to your computer and use it in GitHub Desktop.
Multiple paragraph translating
<p>We're sorry - something's gone wrong.</p>
<p>
Our team has been notified, but click{' '}
<a onClick={() => console.log('hello')}>here</a> to fill out a report.
</p>
@jamuhl
Copy link

jamuhl commented Dec 3, 2018

https://codesandbox.io/s/031l19618n ---> set debug: true in i18next.init call and see the console output for the missing key:

          <Trans>
            <p>We're sorry - something's gone wrong.</p>
            <p>
              Our team has been notified, but click{" "}
              <a onClick={() => console.log("hello")}>here</a> to fill out a
              report.
            </p>
          </Trans>

// ---> <0>We're sorry - something's gone wrong.</0><1>Our team has been notified, but click <2>here</2> to fill out a report.</1> <0>We're sorry - something's gone wrong.</0><1>Our team has been notified, but click <2>here</2> to fill out a report.</1>

personally i would do:

           <p>{t('We\'re sorry - something\'s gone wrong.')}</p>
           <Trans>
            <p>
              Our team has been notified, but click{" "}
              <a onClick={() => console.log("hello")}>here</a> to fill out a
              report.
            </p>
          </Trans>

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment