score:2
Accepted answer
resolved the issue with the help from @gemhar
changes to be made in authform.js
...
import authcontext from '../components/context/authcontext'
class authform extends react.component {
//add this line
static contexttype = authcontext;
constructor(props) {
super(props);
this.state = {
usernameinput: '',
emailinput: '',
passwordinput: '',
confirmpasswordinput: '',
remeberme: false,
agreeterms: false,
todashboard: false
};
}
componentdidmount() {
if (localstorage.token) {
this.setstate(() => (
{
todashboard: true
}
))
}
}
componentdidupdate() {
//i can access setauth here
this.context.setauth(true)
//or by destructuring
let {setauth} = this.context;
setauth(true)
}
render() {
return (
<div>
//some code
</div>
);
}
}
export default authform;
score:1
the most common way to access context from a class component is via the static contexttype. if you need the value from context outside of render, or in a lifecycle method, you'll use it this way.
import react from "react";
import authcontext from "./context";
class authform extends react.component {
constructor(props) {
...
}
static contexttype = authcontext
componentdidupdate() {
const {setauth} = this.context
// access the 'setauth' function here
}
render() {
return <div>some code</div>;
}
}
export default authform;
Source: stackoverflow.com
Related Query
- How to pass function from FUNCTIONAL to CLASS component and access it outside of render( without prop ), using context in react js?
- How to pass value from functional child component to class parent component and save value to state?
- How to pass function from class parent component to child functional component
- How to pass the data from class component to functional component and vice verse
- How to pass function as props from functional parent component to child
- how to access vairables outside of map function in js and jsx in a React component
- How to pass value from a child functional component to parent class component?
- How to pass function as props from one functional component to another?
- How to pass a function as props when both Parent and Child component also a functional component?
- How to pass props from functional component to class component
- How to pass data from functional component to class component
- How to call a react hook fetch request in a functional component to access data then pass to a class component to map?
- How to pass data from functional component to class component in reactjs?
- How to pass argument from functional component to class component
- How to export and import a function from a Class Component
- How to pass a function from outside of main component using react-redux's Provider
- How do I access the Context and Component state from within a DOM callback in a function React component?
- How to access my redux state outside of the functional component or class component?
- ReactJS - How to pass state data and functions from one functional component to other component?
- How to access a function in a child class component from a stateless parent?
- How can i pass props from a functional button component to another function component that displays the prop?
- How do I get a valeu from a async function and pass it to a component ( React )?
- How do I call ReactJS class component and functional component from normal Javascript function?
- Using React, how do you pass a function from a parent component to a child component and run it in the useEffect hook?
- React, how to access the DOM element in my render function from the same component
- Jest/Enzyme Unit Testing: How to pass store to shallow component that uses redux 4 and react-redux 6 connect function
- how to pass object as params in Router.push() in nextjs and access that object in other component
- How to access a static function from a component instance in react?
- React 16: Call children's function from parent when using hooks and functional component
- how to call function of child in functional component from parent in react.js?
More Query from same tag
- React looping and creating new array with nested objects
- Formik - Upon component mount select first option in dropdown list
- React increment state value when radio button is clicked
- How to import a font installed with NPM?
- How can I trigger the onCllick with material-ui option?
- Unable to override the `onChange` handler of formik Select
- Structuring the store in Redux
- Why is `mapStateToProps` always an anonymous function?
- Error when using Maps in react native
- Update array's values from an inside function scope and then return them in Js?
- ES6 React istanbul No coverage information was collected, exit without writing coverage information
- storage.bucket error when i try t post image to firebase
- React component state passed as prop is undefined in Jest test
- Update component when prop value changes
- User discovery project with github api?
- Typescript not recognizing computed property key names
- Chain 2 queries in RTK Query
- react-beautiful-dnd: When multiple lists exists, dragging content in one row will drag same index from all rows
- How can I ignore all files without an extension in eslint
- react 2 similar routes overlap and causes only 1 to show
- How to make a div out of the screen but only slide that element?
- React-router-dom v6 params
- react I want to change the background of globalstyle in chakra theme.ts by props
- React composition: expose higher-order methods
- Why actions in reduxjs-toolkit are not exported ? (Reactjs - reduxToolkit)
- Right way to update state object in redux react native
- Child component rendering before props are ready
- React.memo and invalidation in Functional component not invalidating
- Adding text over image in ReactJS by relative height and width
- async rednering in react