reagent 2020-10-12 | Slack Archive

Fork me on GitHub

jmckitrick13:10:58

Any idea why this would work fine:

jmckitrick13:10:59

[:button {:on-click #(save-form acct)} "Save"]

jmckitrick13:10:06

while this would generate a react error:

jmckitrick13:10:15

[:input {:type "button"} "Save"]

jmckitrick13:10:17

of the type:

jmckitrick13:10:45

' input is a void element tag and must neither have children nor use dangerouslySetInnerHTML.'

p-himik13:10:10

Because <input> and <button> are different HTML elements.

manutter5113:10:17

You want to either make “Save” into a placeholder attribute on the input, or else add a label element to contain the “Save” text.

jmckitrick14:10:17

ok, thanks!

p-himik14:10:22

Just in case - according to MDN, it's the value attribute, not the placeholder.

p-himik14:10:30

Either way, it's better to use :button.

manutter5114:10:49

That depends on what you want “Save” to function as. If you set value to be “Save,” then it will change if you edit the text in the input, but if you want “Save” to function as a label when the input is empty, then you want to assign it to the placeholder attribute.

p-himik14:10:33

What text in what input? <input type="button"> will be rendered as a button, there's nothing editable there.

manutter5114:10:51

Oh, true, I was thinking of text inputs.

manutter5114:10:11

Skimmed right over the {:type "button"} bit, derp