Intro To React Hooks 🎣

Photo by Lynda Hinton on Unsplash
import React from 'react'class PlantShowPage extends React.Component {
state = {
showImage: false,
plant: null
}
componentDidMount() {
this.setState({plant: this.props.plant})
}
componentDidUpdate(prevProps) {
if (prevProps !== this.props && !this.props.plant){
this.getPlant()
}
}
import React, { useState, useEffect } from 'react';const PlantShowPage = props => {  let [showImage, setShowImage] = useState(false); 
let [plant, setPlant] = useState(null);
}
//[this.state.showImage, this.setState({ showImage: bool })]  //[this.state.plant, this.setState({ plant: null })]
onClick={() => setShowImage(!showImage)}
useEffect(() => { 
getPlant().then(plant => {
setPlant(plant)
}
}, []) // <-- dependency array

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store