Im trying to pass an onChange event inside a template literal in a react project. I have some inputs and im trying to change the value based on what the user typed in and for now just print it out inside of paragraph element, my end goal is to save all input information and print it out inside of a new card.

This is my attempt and code

const [title, setTitle] = useState("")


    let output = `<div class="card create-card">
            <div class="card-image"></div>
          <div class="card-text card-text-area">
              
              <h2>Create new spot</h2>
              <form>
              <label>Spot title</label>
              <input
              required
              value="${title}"
              onChange="${(e) =>{setTitle(e.target.value)}}"
              type="text" 
              >
              </input>
            
              <button>Add card</button>

              <p>${ title }</p>
          </div>
          </div>`;

It seems like its an easy fix but cant really find the right syntax when used inside of a template literal.

I dont get any errors nor no output