2017-07-28 12 views
0

Reactのコンポーネントにinput rangeスライダを実装しようとしています。入力タイプ範囲を使用してプロパティターゲットを読み取る方法

しかし、私はスライダーを使用しようとすると、私はスライダーと、サイト区切りを移動するたびに、私はこのエラーを取得し、ここで"Uncaught TypeError: Cannot read property 'target' of undefined".

は、私は、これまでのところ私はどこの任意のアイデアを試してきたものです間違っている?ありがとう!

import React, {Component} from 'react'; 
import Grid from 'material-ui/Grid'; 
import Loader from './Loader'; 

class Leader extends Component { 
    constructor(props){ 
     super(props); 
     this.state = { 
      isLoading: true, 
      value: 3 
     }; 
    } 

componentDidMount(){ 
    //delays rendering for the css loader, which will appear for 1 second and will let the component load after 
    setTimeout(() => this.setState({isLoading: false}), 1000); 
} 

handleSliderChange(event){ 
    this.setState({value: this.event.target.value}); 
} 

render(){ 

    if(loading){ 
     return <Loader /> 
    }else{ 
     return(
      <Grid container gutter={24}>     

       <Grid item xs={12}> 

        <div className="questionDesc questionFadeIn sectionSeperator"> 
         How much money do you want? 
        </div> 

        <div> 
         <input 
         type="range" 
         min="0" 
         max="5" 
         value={this.state.value} 
         onChange={this.handleSliderChange.bind(this)} 
         step="1" /> 
        </div> 
       </Grid> 
      </Grid> 
     ) 
    } 
} 
} 

export default Leader; 
+0

本のonChange = {this.handleSliderChange.bind(e)を}試みると交換し、かわりにthis.event.target.value'に 'のイベント –

+3

を渡し'event.target.value'です。 –

答えて

3
handleSliderChange(event){ 
    this.setState({value: this.event.target.value}); 
} 

handleSliderChange(event){ 
    this.setState({value: event.target.value}); 
} 
関連する問題