CODEWITHSUNDEEP
reactjs
lost9123193
lost9123193

Reputation: 11040

onlyChild Error with React

I'm using rc-slider and I'm getting the following error:

 Error: onlyChild must be passed a children with exactly one child.

I'm a bit confused because it seems like you don't pass anything inside the Rc-slider components aside from the fields required.

Code:

const Slider = require('rc-slider')

class PropertySlider extends Component {

   constructor(props) {
    super(props);
    this.state = { 
        min:10,
        max:50,
      sliderRange: [20, 40],
    };
  }

  onSliderChange(value) {
    console.log(value);
  }

  render() {  
    return(
      <div style={{'width': '80%', 'margin': '0 auto'}}>

        <Slider 
            range 
            defaultValue={[20, 50]} 
            min={this.state.min} 
            max={this.state.max}
            onChange={this.onSliderChange}/>
      </div>
      );
    }
}

Upvotes: 1

Views: 81

Answers (1)

Khalid Azam
Khalid Azam

Reputation: 1643

bind you action function in constructor.

constructor(props) {
    super(props);
    this.state = { 
        min:10,
        max:50,
      sliderRange: [20, 40],
    };
  this.onSliderChange = this.onSliderChange.bind(this);
  }

Upvotes: 1

Related Questions