-3

I'm still learning react, so this may just be because I don't fully understand what I'm doing yet. The formattedText field is just a temporary text that the user creates from a button click. I want to create a running history of this field, so I created historyText.

function App() {
  const [formattedText, setFormattedText] = useState([]);
  const [historyText, setHistoryText] = useState([]);

In my button click action, I'm setting the formattedText:

setFormattedText(tempComp);

And I thought I could just append it to my history:

setHistoryText(historyText+tempComp);

But it doesn't work, all I get is [object Object],[object Object],[object Object],[object Object],[object Object] as my output.

** Clarification: the reason this may look strange because I'm storing html in the strings and wanted it to show as html. Here's how I'm building tempComp:

tempComp.push(<p><b>{dResult[y].dp5}</b></p>);

Different lines are formatted differently, so I couldn't just use a split to add in a <p> for example.

baumli
  • 421
  • 5
  • 24
  • Can we see other parts of your component, please? – devserkan Dec 24 '19 at 13:55
  • Use `setHistoryText([...historyText, tempComp]);` (this will append the value to the array) –  Dec 24 '19 at 14:00
  • @ChrisG, your suggestion worked. Now its showing a running log of what I want. Can you post it as an answer so I can accept it? – baumli Dec 24 '19 at 14:17
  • 1
    I've marked this as a duplicate instead, since it is :) (I didn't downvote though) –  Dec 24 '19 at 14:17

1 Answers1

0

This happens because, ou are not using String values but an Object and the default string representation of an object is just [object Object]. I'm not totally sure, what you want to add to read more here.

setHistoryText(historyText+tempComp);

but maybe try to console.log the objects out first, and see if maybe you where meant to access an attribute instead

//other logic
console.log(historyText) //do you mean to access a value on the object instead?
console.log(tempComp)
setHistoryText(historyText+tempComp);
Kristoffer Tølbøll
  • 3,157
  • 5
  • 34
  • 69