title: React Hooks and Fetch: How to update a table based on a user input from an API search
body: <p>I'm new to react/hooks I'm having a bit of trouble getting my head around updating a search on an API based on a user input. I currently have an API that im hitting to get a table of stocks. I then draw this table. I have created some radio buttons that allow the user to click so that it can refine the search on the API. I am passing the value of the selected radio button back to the URL as <code>industrySelection</code>, what I am hoping for is that the table will update from this result but it doesn't do anything. Could someone please explain how to fix this and why? </p>
  
  <pre><code>function StockTable() {
    const [industrySelection, setIndustry] = useState("");
    const [rowData, setRowData] = useState([]);
  
    const columns = [
      { headerName: "Stock", field: "name"}, 
      { headerName: "Symbol", field: "symbol"}, 
      { headerName: "Industry ", field: "industry"}
    ];
  
  
    useEffect(() =&gt; {
      fetch(`http:PRIVATE/stocks/symbols/${industrySelection}`)
      .then(res =&gt; res.json())
      .then(data =&gt; 
        data.map(stocks =&gt; {
          return {
            name: stocks.name,
            symbol: stocks.symbol,
            industry: stocks.industry,
          };
        })
      )
      .then(stocks =&gt; setRowData(stocks));
    }, []);
  
    return (
  /* Place Search Options and grab users choice */
      &lt;div className = "userSelect"&gt;
        {
          industryChoices.map(feature =&gt; (
              &lt;ul className = "radioULlist"&gt; 
                &lt;li className = "radioList"&gt;
                  &lt;input type="radio" name="radioButton" value = {feature}  
                    onChange={event =&gt; {
                      const { value } = event.target;
                      setIndustry(value);
                    }}
                  /&gt;
                  &lt;label className = "radioLabel"&gt;{feature}&lt;/label&gt;
                &lt;/li&gt;
              &lt;/ul&gt;
        ))}
      &lt;/div&gt;
  /* DRAW TABLE HERE */
    );
  }
  </code></pre>