Перевод строк в React

#javascript #reactjs

#javascript #reactjs

Вопрос:

Я пытаюсь отфильтровать некоторые данные на основе переведенных имен. То, что я пробовал, это

 filterInput === <Translator getString={item} />
  

Вот мой Translator :

 export function Translator({ getString }) {
   const languageContext = useContext(LanguageContext);
    
   return languageContext.dictionary[getString] || getString;
}
  

Вместо переведенной строки я получаю весь объект целиком. Как я могу получить только переведенную строку, чтобы я мог их сравнить?

Редактировать:

Вот структура объекта:

 $$typeof: Symbol(react.element)
key: null
props: {getString: "Vegetables"}
ref: null
type: ƒ Translator({ getString })
_owner: null
_store: {validated: false}
_self: null
_source: {fileName: "...srccomponentscommonAutoCompleteBox.js", lineNumber: 14, columnNumber: 19}
__proto__: Object
  

Комментарии:

1. можете ли вы опубликовать структуру полученного объекта?

2. приведенную выше структуру объекта вы получили от return languageContext.dictionary[getString] || getString верно?

3. Да, это структура

4. можете ли вы добавить console.log(languageContext.dictionary[getString] || getString) перед возвратом в функцию Translator?

5. Он ничего не регистрирует. Я предполагаю, что происходит то, что он все еще не достиг оператора return, поэтому он по-прежнему является объектом, а не простой строкой. На самом деле он работает всякий раз, когда вызывается в jsx компонента, но не тогда, когда он находится в функции JS