Javascript Can'；使用Redux和React时，不要从Firebase集合中删除数据（文档）

我正在使用React和Redux，在这个问题上花了几个小时之后，我仍然无法使用React和Redux删除Firebase中的文档

我在仪表板中显示项目摘要，并尝试添加删除按钮

单击按钮后，项目将传递到my

projectActions.js

action，我想在其中删除项目。之后，我想将类型发送到

projectReducer.js

。我没有收到错误，当我单击按钮返回后，我无法输出任何

控制台.log

。我确实将项目数据放入

removeProject（）

函数中

我已尝试删除

removeProject（）

和

console.log中传递的项目的return方法。我可以获取
project.id
并将其添加到
firestore.collection.delete（）
函数中。但由于回归后一切都不起作用，这是不可能的

ProjectSummary.js
：

import React，{Component}来自“React”
从“时刻”导入时刻
从“react redux”导入{connect}
从“../../store/actions/projectActions”导入{removeProject}
从“react router dom”导入{Link}
类ProjectSummary扩展了组件{
状态={
项目：this.props.project
}
handleRemove=（e）=>{
e、 预防默认值（）
removeProject（this.state.project）
}
render（）{
const{project}=this.props
返回(
{project.title}
由{project.authorFirstName}{project.authorLastName}发布

{时刻（project.createdAt.toDate（））.calendar（）}
去除
)
}
}
const mapDispatchToProps=（调度）=>{
返回{
removeProject：（项目）=>调度（removeProject（项目））
}
}
导出默认连接（空，mapDispatchToProps）（项目摘要）

projectActions.js
：

export const removeProject=（项目）=>{
返回（dispatch，getState，{getFirestore}）=>{
const firestore=getFirestore（）
firestore.collection（'projects'）.doc（project）.delete（）
.然后（（）=>{
分派（{type:'REMOVE_PROJECT'}）
}).catch（函数（err）{
分派（{type:'REMOVE_PROJECT_ERROR'，err}）
});
}
}

projectReducer.js
：

constprojectreducer=（state=initState，action）=>{
开关（动作类型）{
案例“创建项目”：
log（“创建的项目”，action.Project）
返回状态
案例“创建项目错误”：
console.log（'create project error'，action.err）
返回状态
案例“删除项目”：
console.log（'已删除的项目'）
返回状态
案例“删除项目错误”：
console.log（'Removed Project Error'，action.err）
返回状态
违约：
返回状态
}
}
穿上这个：

ProjectSummary.js

    (…)
        import { removeProject } from '../../store/actions/projectActions' 
        import { connect } from 'react-redux';
        (…)
        class ProjectSummary extends Component {
        state = {
          project: this.props.project
        } 
        render() {
        const { project, deleteProject}  = this.props 
        (…) 

            <button onClick={ () => removeProject(project.id)}>Delete</button>

        (…)

            const mapDispatchToProps = (dispatch) => {
              return {
               removeProject: (id) => { dispatch(removeProject(id))},
              }
             }
        export default connect(null, mapDispatchToProps)(ProjectSummary)

穿上这个：

ProjectSummary.js

    (…)
        import { removeProject } from '../../store/actions/projectActions' 
        import { connect } from 'react-redux';
        (…)
        class ProjectSummary extends Component {
        state = {
          project: this.props.project
        } 
        render() {
        const { project, deleteProject}  = this.props 
        (…) 

            <button onClick={ () => removeProject(project.id)}>Delete</button>

        (…)

            const mapDispatchToProps = (dispatch) => {
              return {
               removeProject: (id) => { dispatch(removeProject(id))},
              }
             }
        export default connect(null, mapDispatchToProps)(ProjectSummary)

你的reducer没有做任何事情，不清楚你有什么问题，似乎你不理解redux的概念。除了打印到控制台之外，你希望reducer做什么？很确定这是来自youtube频道。我还想知道如何删除帖子。你找到方法了吗？只是为了澄清一下，下面提供的答案能够成功地用于网络忍者教程。（稍作调整）。你的reducer没有任何作用，不清楚你有什么问题，似乎你不理解redux的概念。除了打印到控制台之外，你希望reducer做什么？很确定这是来自youtube频道。我还想知道如何删除帖子。你找到方法了吗？只是为了澄清一下，下面提供的答案能够成功地用于网络忍者教程。（有一些小的调整）。如果你正在学习网络忍者关于React-Redux和Firebase的教程，那么上面描述的总体设计应该适合你，并有一些可能的轻微调整。如果你在学习网络忍者关于React-Redux和Firebase的教程，那么上面描述的总体设计应该适合你，有几个可能的轻微调整。