Как вызвать функцию, присутствующую параллельно с вызовом функции в контекстном API React

Как вызвать функцию, присутствующую параллельно с вызывающей функцией в контекстном API React

Вы можете объявить функции над объявлением класса и предоставить их внутри значения поставщика контекста, или, если вам нужен доступ к состоянию, вам нужно будет определить их внутри вашего класса и отправить ссылки на методы.

Пример внешних функций:

 import React, { createContext, Component } from 'react'; export const WebContext = createContext(); const update = () ={amp}gt; { /* Do something, you can call here updateAgain() */ }; const updateAgain = () ={amp}gt; { /* Do something else */ }; export default class WebContextProvider extends Component { state = { someState: 1, }; render() { return ( {amp}lt;WebContext.Provider value={{ data: ...this.state, update, updateAgain }}{amp}gt; {this.props.children} {amp}lt;/WebContext.Provider{amp}gt; ); } } 

Пример с методами класса, когда вам нужно использовать state :

 import React, { createContext, Component } from 'react'; export const WebContext = createContext(); export default class WebContextProvider extends Component { state = { someState: 1, }; render() { return ( {amp}lt;WebContext.Provider value={{ data: ...this.state, update: this.update, updateAgain: this.updateAgain }}{amp}gt; {this.props.children} {amp}lt;/WebContext.Provider{amp}gt; ); } update = () ={amp}gt; { /* Do something, you can call here this.updateAgain() or use this.state */ } updateAgain = () ={amp}gt; { /* Do something else, you can use this.state here */ } } 
Понравилась статья? Поделиться с друзьями:
JavaScript & TypeScript
Adblock
detector