react useref current.innerHTML

IkennaGIfenna answered on August 18, 2022 Popularity 5/10 Helpfulness 1/10

answer react useref current.innerHTML

react useref current.innerHTML

Comment

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
    <title>Add React in One Minute</title>
  </head>
  <body>
    <div id="root"></div>
    <script src="https://unpkg.com/react@17/umd/react.development.js" crossorigin></script>
    <script src="https://unpkg.com/react-dom@17/umd/react-dom.development.js" crossorigin></script>
    <script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>
    <script type="text/babel">
      const MyForm = () => {
        const [food, setFood] = React.useState('');  
        const formatStatus = () => {
          return `I want to eat ${food}`
        }
        const handleChange = (e) => {
          setFood(e.target.value);
        }
        const logText = () => {
          console.log(formatStatus(food));
        }
        return (
          <div>
            <input onChange={handleChange} value={food} />
            <div>{formatStatus(food)}</div>
            <button onClick={logText}>Log Text!</button>
          </div>
        )
      }
      const App = () => {
        return (
          <MyForm/>
        );
      };
      ReactDOM.render(<App />, document.getElementById("root"));
    </script>
  </body>
</html>Add this to your knowledge
 Run code snippet

Popularity 5/10 Helpfulness 1/10 Language javascript

Source: stackoverflow.com

Tags: javascript use-ref

Link to this answer
Share Copy Link