score:0
typically the issue when something like this ends up as undefined is that the "this" isn't bound to a specific object. for classes that have methods that use "this", especially using react, i would recommend binding them in the constructor. for example:
class editjobscheduler extends component {
constructor(props) {
super(props);
this.state = { modalactive: false, todaydate: moment() };
this.handlechange = this.handlechange.bind(this);
}
handlechange = (date) => {
this.setstate({
todaydate: date
});
}
something like this binds the method to each instance rather than to the class itself. i hope this helps.
score:1
i think you're trying to join handler and renderer into one method.
it doesn't make sense - handler changes state which will force new render - event if it would work in first pass - next would overwrite it but also call setstate and so on...
just use it separately:
jobclickedhandler = (event, index) => {
this.setstate( { editmodalactive: true });
}
rendereditmodal = () => {
return (
<editjobscheduler
open={this.state.editmodalactive}
onclose={this.closeeditmodal}
schedulejobhandler={this.schedulejobhandler}
inputhandler={this.inputhandler}
jobinfo={this.state.jobdata[index]}
/>
)
}
{this.state.editmodalactive && this.rendereditmodal() }
i would also decompose content/functional parts to separate components to avoid rerendering of all elements on each state change.
Source: stackoverflow.com
Related Query
- React State data not able to be passed as props
- React component not able to dynamically require() an image file when filename is passed down via props
- Not able to set state in React Hooks using data received from Axios
- React component state not updating with passed props
- React Redux Data not being passed to props
- Not able to access array passed as props from parent - React
- Data is not being passed correctly via props React
- How a React component is able to access props not passed to that component?
- Data not being passed from state to props on GET request
- Not able to display the data stored in a state object in react
- React shouldComponentUpdate() is called even when props or state for that component did not change
- Props not updating when redux state change in React Hooks
- React / Redux: mapStateToProps not actually mapping state to props
- Is it a bad practice to use state in a React component if the data will not change? Should I use a property on the class instead?
- React Redux Mapping state to props not working
- Not able to increment count using state in react
- Not able to access react state from socket event handler function
- React Hooks, useReducer not able to get state
- Not able to set state in componentWillReceiveProps in React
- Edit function not saving changes to state data in React
- React hooks updated state not passed to function
- How to check what additional props were passed into a react component that were not defined?
- wrote a React code snippet to implement conditional rendering and am not able to update the state of {Left} and {Right}
- React setState not working after deleting data from state copy
- Data passed as props is not shown in django and reactjs
- Not Able to access updated state in react
- React - api data is being successfully passed to component(per inspector) but not being rendered
- Avoid loading data passed as props with React Router
- I am not able to render the data in react
- Why does storing Open Weather Api fetched data in saved state not render in React JS?
More Query from same tag
- Unable to change theme in @monaco-editor/react
- ES2015: How can I simplify an if statement with assignment?
- CORS enable in servlet
- How to select boolean value with Cypress select method without type error?
- Make scroll to top button with animation in React
- Styled Components Props React js
- React scroll to ref with multiple scrollbars
- Unable to position content to be center in flexbox
- Why props are not setting as state?
- Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined React
- How to implement ListView in ReactNative with custom cell component?
- State updates might be asynchronous
- How to Accept File and string data from Post Request in ASP.Net Core 2.0?
- How to override .MuiSelect-nativeInput in Material-UI
- React + Material UI - Overriding MuiTheme in component withStyles
- Error says: " Uncaught TypeError: path.split is not a function". I am guessing the error is due to react-hook-form update. Does anyone know this?
- Timers within react redux: Actions to track tick, or just start/stop
- React: How I can change a state variable based on the value of another state variable?
- How to reload a component (part of page) in reactjs?
- Cannot get object values in react js
- Enums with Typescript
- Computed Properties not working with Babel preset-env
- Configure Next Js For Images For External Domains
- To retrieve a value in a Promise
- How to calculate and store item property when rendering that item?
- React - toggling input in a cell of a table
- React-redux tutorial : Where does children come from
- How to set an initial state using the useState hook
- How to extract the value and the key of my MenuItem when it is clicked?
- Can't figure out how to show the list dropdown options based on the country in the URL