Namspaces

Jaeseok Han·2023년 8월 14일
0

react-i18next(i18n)

목록 보기
2/10

네임스페이스 용이성

다양한 변수가 생기고 겹쳐지는 변수의 이름이 많아질수록 변수이름이 길어지고 헷갈리게 된다.

ex)
userNumber
userPhone ...

해당 부분을 해결하기 위해서 하위로 하여 접두사를 붙이는 식으로 사용이 가능하다

네임스페이스로 키값 활용

i18next.init({
    fallbackLng : 'en',
    lng : 'en',
    resources : {
        en : {
            translation : {
                key : 'hello world',
                look : {
                    deeper : 'some deep key'
                }
            },
            common: {
                save : "Save",
              	cancel : "Cancel"
            }
        },
        kr : {
            translation : {
                key : '안녕'
            },
            common: {
                save : '저장'
            }
        }

    }
})
const ret = i18next.t("save", {ns : "common", lng : "kr"});
console.log(ret);
저장 // 출력

네임스페이스 기본값 설정

해당 네임스페이스가 없을 경우 fallbackNS 로 설정된 네임스페이스를 통해서 값을 찾아 리턴해준다.

i18next.init({
    fallbackNS : 'common',
  	...
})

error 처리

 en : {
   translation : {
     key : 'hello world',
       look : {
         deeper : 'some deep key'
       },
         error : {
           404 : "Not found!",
             unknown : "Some strange thing happened"
         }
   },
...
const code = 404;
const ret = i18next.t([`error.${code}`, 'error.unknown']);
console.log(ret);
Not found! //출력

코드를 입력하세요

0개의 댓글