Return a string on button click in React hooks

0
votes

I am trying to print a string upon button click inside React hooks.

This button called "More Info" is inside a return tag of a hook I created. (JSX) when this is clicked it calls another function component called "ChangeName" that should print a string.

I am not sure if I am writing some wrong syntax or missing something? The console.log inside the function displays the string in the log but the div tag just doesn't print the string on the console,

created a custom hook and the button is inside its return tag.

 <button onClick ={ChangeName}>More Info <button>

onclick should call and print results from the below function

 function ChangeName(){ 
         console.log("This is a test") //works
          return (<div>"This is a test"</div>)
          }
1
reactjsreact-hooks

1 Answers

1
votes

Tt's not related react hook , if you want to print string above button you should make a state use useState from react hooks

const SomeComp = () => {
   const [value, setValue] = useState("")
   const changeName = () => {
      setValue("some value changed")
   }
   return (
     <>
     {value.length > 0 && <div>{value}</div>}
     <button onClick={changeName}>Change Name</button>
     </>
   )
}