Объясните эту проблему с dispatch () и connect () в redux? - PullRequest
Новая
       14

Объясните эту проблему с dispatch () и connect () в redux?

0 голосов
/ 09 ноября 2019

Я смотрю этот учебник, и приведенный ниже код отлично работает в видео, но когда я его пробую, я получаю сообщение об ошибке «диспетчер не определен». Почему это так? 

import React from 'react'
import {connect} from 'react-redux'
import {removeExpense} from '../Actions/Actions'

const ListItem = ({id, description, note, amount, createdAt})=>(
    <div>
        <h5>{description}</h5>
        <p>Note: {note}</p>
        <p>Amount: {amount}</p>
        <p>Created @{createdAt}</p>
        <button onClick={()=>{dispatch(removeExpense(id))}}>remove</button>
        <br/>
    </div>
)

export default connect()(ListItem); //Just to inject dispatch()

Преподаватель использует redux v3.7.2, response-redux v5.0.5 реагирует v15. Теперь я знаю, что, если я подойду к нему, как показано ниже, я смогу решить проблему. 

const ListItem = (props)=>(
    <div>
        <h5>{props.description}</h5>
        <p>Note: {props.note}</p>
        <p>Amount: {props.amount}</p>
        <p>Created @{props.createdAt}</p>
        <button onClick={()=>{props.dispatch(removeExpense(props.id))}}>remove</button>
        <br/>
    </div>
)

Почему кнопка удаления не работает в первом коде? Это могут быть устаревшие версии библиотек?

Ответы [ 2 ]

1 голос
/ 09 ноября 2019

При удалении реквизита вы пропустили отправку, которая должна быть передана.

Либо добавьте ее в свое заявление о разрушении: 

const ListItem = ({id, description, note, amount, createdAt, dispatch})=>(

, либо получите доступ к ней через props

<button onClick={()=>{props.dispatch(removeExpense(id))}}>remove</button>
1 голос
/ 09 ноября 2019

Вы можете исправить свой первый пример, изменив эту строку: 

const ListItem = ({id, description, note, amount, createdAt})=>(

на 

const ListItem = ({id, description, note, amount, createdAt, dispatch})=>(
...