Доступ к значению контекста в ловушке - PullRequest
Новая
       20

Доступ к значению контекста в ловушке

0 голосов
/ 02 апреля 2020

Я пытаюсь использовать Context API, но я сталкиваюсь с проблемой использования значения в ловушке React.

Вот как я создаю свой Context: 

import React from 'react'

export const DecimalSeparatorContext = React.createContext('.')

export function getDecimalSeparator () {
  return React.useContext(DecimalSeparatorContext) || '.'
}

export function isDecimal (value: string): boolean {
  const decimal = getDecimalSeparator()
  return !!value && value.includes(decimal)
}

Вот как я вставляю его в свое приложение: 

const App: React.FC<AppProps> = ({ decimalSeparator = '.' }) => {
  return (
    <DecimalSeparatorContext.Provider value={decimalSeparator}>
    ...
    </DecimalSeparatorContext.Provider>
  )
}

Но когда я хочу использовать его в ловушке, я получаю ошибку: 

   const Component = (props) => {
     useEffect(() => isDecimal(myDecimal),[myDecimal])
     // -> Error: Invalid hook call. Hooks can only be called inside of the body of a function component.
   }

Я понимаю, что не могу выполнить useContext внутри хука.

Так, как правильно сделать это?

1 Ответ

0 голосов
/ 02 апреля 2020

Вы пытались запустить useContext прямо перед useEffect? ​​

Что-то вроде этого: 

const Component = (props) => {
    const myDecimal = isDecimal('12.3');
    useEffect(() => {
      if(myDecimal) {
        // use myDecimal here
      }
    },[])
}
...