2

I'm trying to find out if its possible to get context outside of the React component level from within a method. As an example below I have a modal where on activate modal and deactivate, I want to change the providers state to a certain value.

I don't really need to access that state from within the render method, but instead i'd like to change the context from within the two methods by passing in the context. Is there a way to handle this with the context api? Can I fire off a provider action from within there without having to wrap my modal component in AppContext?

import React, { Component } from "react";
import "./Modal.module.css";
import AppContext from "../../context/Context";
class Modal extends Component {
 constructor(props) {
 super(props);
 this.state = {
      modalActive: false
    };
  }
 activateModal = (context) => {
 this.setState({ modalActive: true });
 context.action.changeVal(2);
  };
 deactivateModal = (context) => {
 this.setState({ modalActive: false });
 context.action.changeVal(1);
  };
render() {
return (
       <React.Fragment>
        <button onClick={this.activateModal} className="link">
        click
        </button>
        <ModalContent />
      </React.Fragment>
    );
  }
}
Mr. BigglesWorth
  • 1,530
  • 3
  • 18
  • 33

0 Answers0