question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Automatically closed when setState of input that inside of AccordionItemBody

See original GitHub issue
handleConfigChange(e){
    let {name, value} = e.target;
    this.setState({[name]: value})
}
<Accordion>
  <AccordionItem>
    <AccordionItemTitle>
      <h3>
        Title
        <i className="icon-Arrow-Asset-41 pull-right"></i>
      </h3>
    </AccordionItemTitle>
    <AccordionItemBody>
      <div className="leads-custom-form form-option-config">
        <div className="form-group">
          <input name="title" className="form-control" placeholder="Title" defaultValue={title}
                 onChange={this.handleConfigChange}/>
        </div>
      </div>
      <div className="leads-custom-form">
        <div className="form-group">
          <label>Text Color:</label>
          <input type="color" name="title_color" className="form-control" defaultValue=
            {title_color} onChange={this.handleConfigChange}/>
        </div>
      </div>
    </AccordionItemBody>
  </AccordionItem>
</Accordion>

Issue Analytics

  • State:closed
  • Created 6 years ago
  • Comments:16 (8 by maintainers)

github_iconTop GitHub Comments

1reaction
hyanmandiancommented, Nov 8, 2017

Yes @vincentaudebert, I’ve created an example: https://codesandbox.io/s/lyp4yx85l9

0reactions
cjpdeecommented, Aug 5, 2020

Still getting this problem in v3.3.0, on radio buttons in a react component inside the body of the accordion

Read more comments on GitHub >

github_iconTop Results From Across the Web

How to prevent setState changing input field? - Stack Overflow
I believe this is happening due to setState inside of optionOnChange function. Whenever I click one of checkboxes, setState takes place and it ......
Read more >
Extracting Input from a Form with React.js | Pluralsight
This way, an update to the value of an input element will automatically update the value of the object's attribute that it was...
Read more >
Lifting State Up - React
Inside these methods, the Calculator component asks React to re-render itself by calling this.setState() with the new input value and the current scale...
Read more >
How State Works in React – Explained with Code Examples
Calling setState automatically re-renders the entire component and all its child components. We don't need to manually re-render as seen ...
Read more >
Handling Text Input - React Native
TextInput is a Core Component that allows the user to enter text. It has an onChangeText prop that takes a function to be...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found