archaeopteryx | Ruby MIDI DJing/live-coding thing | Audio Utils library
kandi X-RAY | archaeopteryx Summary
kandi X-RAY | archaeopteryx Summary
Ruby MIDI DJing/live-coding thing
Support
Quality
Security
License
Reuse
Top functions reviewed by kandi - BETA
- generate samples
- Generates a random value from the given hash
- Returns an array of songs from the hash
- Creates an array of positions
- reload file
- Initialize the measure
- Play the given audio artist
- Check if the given value is given
archaeopteryx Key Features
archaeopteryx Examples and Code Snippets
Community Discussions
Trending Discussions on archaeopteryx
QUESTION
I'm trying to handle the selection of dynamically generated 's in a
element. I understand that the onChange trigger is what i need to setState with but i can't seem to get her to work.
Here's what i've got going on:
See the Pen dynamic select by Archibald Hammer (@archaeopteryx) on CodePen.
import React from 'react'
import ReactDOM from 'react-dom'
import _ from 'lodash'
const ITEMS = [
{ name: 'centos', text: 'centos', value: 'centosValue' },
{ name: 'ubuntu', text: 'ubuntu', value: 'ubuntuValue' },
]
const SelectComponent = (props) => (
{_.map(props.items, (item, i) =>
)}
)
const Option = (props) => (
{props.text}
)
class App extends React.Component {
constructor() {
super()
this.state = {
selected: ''
}
this.handleSelect = this.handleSelect.bind(this)
}
handleSelect(e) {
this.setState({selected: e.target.value})
}
render() {
return (
Selected: {this.state.selected}
)
}
}
ReactDOM.render(, document.getElementById('app'))
This code does render the dropdown selector as expected but it isn't triggering the setState on the selected item. Any thoughts?
Also, does anyone have any pro-tips for troubleshooting this kind of problem? Any super slick dev-tools you know of or methods for finding out which props are being passed, etc?
...ANSWER
Answered 2017-Jul-22 at 22:49The problem is that the options in a select element won't trigger any event, the change is happening in the select element not the option. All you have to do is pass the handleSelect
method to the component:
const SelectComponent = (props) => (
{_.map(props.items, (item, i) =>
)}
);
const Option = (props) => (
{props.text}
)
Sorry I forgot to add the live sample link: https://codesandbox.io/s/31AyQ2woR
In terms of a tip for debugging, in this particular case just know that the event is triggered by the select component and not the option element ;). But the one I use all the time is React developer tools:
https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi
Community Discussions, Code Snippets contain sources that include Stack Exchange Network
Vulnerabilities
No vulnerabilities reported
Install archaeopteryx
On a UNIX-like operating system, using your system’s package manager is easiest. However, the packaged Ruby version may not be the newest one. There is also an installer for Windows. Managers help you to switch between multiple Ruby versions on your system. Installers can be used to install a specific or multiple Ruby versions. Please refer ruby-lang.org for more information.
Support
Reuse Trending Solutions
Find, review, and download reusable Libraries, Code Snippets, Cloud APIs from over 650 million Knowledge Items
Find more librariesStay Updated
Subscribe to our newsletter for trending solutions and developer bootcamps
Share this Page