как передать значение из поля ввода в редуктор в reactjs - PullRequest
Новая
       3

как передать значение из поля ввода в редуктор в reactjs

0 голосов
/ 27 мая 2020

Я просто создаю простой проект redux, и я столкнулся с новой вещью, которую я не знал, cz Im new в reactJS, это как передать значение из редуктора, чтобы заменить globalstate новым значением i 've прошел, 

    //Global State
    const initialstate = {
       nameOrder : ''
    }

   // Reducer Action
   const rootReducer = (state = initialstate ,action) => 
   {
    console.log(action.value)
    if(action.type === 'CHANGE'){
       return{
      ...state,
         nameOrder : action.value

        }
      }
    return state;
  }

//Store
const storeroot = createStore(rootReducer);

, и это мой код для передачи значения, которое я хочу 

render() {
        console.log(this.props);
        return (
            <div>
                <Card width="50%">
                    <CardHeader>
                        {this.props.order}
                    </CardHeader>
                    <CardBody>
                        <Form inline>
                            <FormGroup>
                                <Label  >Desc1</Label>
                                <Input onChange={this.HandleChange1} />
                            </FormGroup>
                            <FormGroup>
                                <Label  >Desc2</Label>
                                <Input onChange={this.HandleChange2} />
                            </FormGroup>
                            <FormGroup>
                                <Label>Harga</Label>
                                <Input onChange={this.onChangePrice}/>
                            </FormGroup>
                            <Button onClick={this.props.ubah}>Submit</Button>
                        </Form>
                    </CardBody>
                    <CardFooter>
                    </CardFooter>
                </Card>
            </div>
        )
    }


const mapStatetoProps = (state) =>{
    return{
        order : state.totalOrder
    }
}

const mapDispatchtoProps = (dispatch) =>{
    return{
        ubah:() => dispatch({type: 'CHANGE',value:this.state.desc1})
    }
}
export default connect(mapStatetoProps,mapDispatchtoProps)(Addform)

в mapDispatchtoProps this.state.desc1 его ошибка выброса, может кто-нибудь поможет мне решить эту проблему

1 Ответ

1 голос
/ 27 мая 2020

Ответ очень прост. 

 ubah:() => dispatch({type: 'CHANGE',value:this.state.desc1})

В приведенном выше утверждении этот указатель не определен. Вы должны передать значение в качестве параметра. 

 ubah:(description) => dispatch({type: 'CHANGE',value:description})

Когда вы используете функцию для обработки событий, вы должны вызывать ее, как показано ниже: 

<Button onClick={() => this.props.ubah(this.state.desc1)}>Submit</Button>
...