javascript - 在 mapStateToProps 方法上显示的存储属性，但在 redux-dev-tools 上的存储为空

Question

当我在 Bugs.js 的第 21 行进行控制台时，它的播种是我不屑一顾的行动结果，但是当我在 li 标签中打印数据时..它是空白的。商店也没有在 redux-dev-tools 中改变

那是我的 App.js 代码

function App() {
  const store = configureStore()
  return (
    <Provider store={store}>
      <Bugs />
    </Provider>
  );
}

export default App;

那是 Bugs.js

const Bugs = (props) => {
    useEffect(props.addBug, [])
    return (
        <ul>
            {
                props.bugs.map(bug => {
                    <li>
                        {bug.description}
                    </li>
                })
            }
        </ul>
    )
}

const mapStateToProps = state => {
    console.log('Aftab', state.bugs);
    return (
        {
            bugs: state.bugs
        })
}

const mapDispatchToProps = dispatch => {
    return (
        {
            addBug: () => dispatch(addBug({ description: 'Bug 1' }))
        }
    )
}

export default connect(mapStateToProps, mapDispatchToProps)(Bugs)

那就是减速机

let lastId = 0
const slice = createSlice({
    name: 'bugs',
    initialState: [],
    reducers: {
        addBug: (bugs, action) => {
            bugs.push({
                id: lastId++,
                description: action.payload.description,
                resolved: false
            })
        },
        resolveBug: (bugs, action) => {
            const index = bugs.findIndex(b => b.id === action.payload.id)
            bugs[index].resolved = true
        },
        assignBug: (bugs, action) => {
            const index = bugs.findIndex(b => b.id === action.payload.bugId)
            bugs[index].userId = action.payload.userId
        }
    }
})
export const { addBug, resolveBug, assignBug } = slice.actions
export default slice.reducer

export const getBugList = userId => createSelector(
    state => state.entities.bugs,
    bugs => bugs.filter(b => b.userId === userId)
)

标签： javascriptreactjsredux

Answer 1

您将需要调用该函数以使调度工作

在你的Bugs.js改变

useEffect(props.addBug, [])

至：

useEffect(props.addBug(), [])