<button onClick={(e) => this.deleteRow(id, e)}>Delete Row</button>
<button onClick={this.deleteRow.bind(this, id)}>Delete Row</button>
You can even try the way it's documented in the React Docs to avoid any confusion https://reactjs.org/docs/handling-events.html#passing-arguments-to-event-handlers
class AddRecipe extends Component{
...
onLoad() {
var recipe = document.querySelector(".recipe")
const name = data.forEach((d,index) => {
...
recipecard.addEventListener("click",(event) => this.onModal(index))
recipe.appendChild(recipecard)
})
}
onModal = (index) => {
...
this.setState({ setIndex:index })
}
...
}
export default AddRecipe
Currently you are not handling the resize event handler correctly. The first argument of the resize event handler would be a resize event. Also you would pass a function to a handler rather than executing a function as a handler. Try the following instead:
window.addEventListener('resize', () => updateWindowDimensions(window.innerWidth))
Recommend
React Rules of Hooks Explanation
React Rules of Hooks ESLint Plugin
ReactDOMServer Reference renderToStaticNodeStream()
ReactDOMServer Reference renderToNodeStream()
ReactDOMServer Reference renderToStaticMarkup()
ReactDOMServer Reference renderToString()
React Testing Recipes Multiple Renderers
React Testing Recipes Snapshot Testing
React Testing Recipes Mocking Modules
React Testing Recipes Data Fetching
React Testing Recipes Rendering
React Testing Recipes Setup/Teardown
React Rendering Elements Updating the Rendered Element
React Rendering Elements Rendering an Element into the DOM
React Component State What is the difference between passing an object or a function in setState?
React Component State Why is setState giving me the wrong value?
React Refs and the DOM Callback Refs
React Refs and the DOM Accessing Refs Refs and Function Components
React Refs and the DOM Accessing Refs Adding a Ref to a Class Component
React Refs and the DOM Accessing Refs Adding a Ref to a DOM Element
React Refs and the DOM Accessing Refs
React Refs and the DOM Creating Refs
File Structure Is there a recommended way to structure React projects? Grouping by file type
Glossary of React Terms Components props.children
Glossary of React Terms Components props
Glossary of React Terms Components
Glossary of React Terms Elements
React Code-Splitting Named Exports
React Code-Splitting Route-based code splitting
Code-Splitting React.lazy Error boundaries
React Code-Splitting Bundling Example
React Test Utilities Other Utilities Simulate
React Test Utilities Reference renderIntoDocument()
React Test Utilities Reference findRenderedComponentWithType()
React Test Utilities Reference scryRenderedComponentsWithType()
React Test Utilities Reference findRenderedDOMComponentWithTag()
React Test Utilities Reference scryRenderedDOMComponentsWithTag()
React Test Utilities Reference findRenderedDOMComponentWithClass()
React Test Utilities Reference scryRenderedDOMComponentsWithClass()
React Test Utilities Reference findAllInRenderedTree()
React Test Utilities Reference isCompositeComponentWithType()
React Test Utilities Reference isCompositeComponent()
React Test Utilities Reference isDOMComponent()
React Test Utilities Reference isElementOfType()
React Test Utilities Reference isElement()
React Test Utilities Reference mockComponent()
React Test Utilities Reference act()
React Profiler API onRender Callback
React AJAX and APIs Example: Using AJAX results to set local state