在执行switch case语句时，如何重定向到reactjs中的另一个页面？

我想知道如何在案例陈述后进行重定向。我一直在编写这段代码，但是在case语句之后，什么都没有发生。我在网上查看，但似乎没有任何效果。当我提交经过验证的表单时，它不会重定向或刷新

代码

创建广告代码：

import React, { Component } from 'react'
import { connect } from 'react-redux'
import { createAd } from '../../store/actions/adActions'
import { Redirect } from 'react-router-dom'
import firebase from "firebase";
import FileUploader from "react-firebase-file-uploader";

class CreateAd extends Component {
  state = {
    title: '',
    content: '',
    avatar: "",
    isUploading: false,
    progress: 0,
    avatarURL: "",
    contactno:""
  }
  handleChange = (e) => {
    this.setState({
      [e.target.id]: e.target.value
    })
  }
  handleSubmit = (e) => {
    e.preventDefault();
    this.props.createAd(this.state);
  }

handleUploadStart = () => this.setState({ isUploading: true, progress: 0 });
handleProgress = progress => this.setState({ progress });
handleUploadError = error => {
  this.setState({ isUploading: false });
  console.error(error);
};

handleUploadSuccess = filename => {
  this.setState({ avatar: filename, progress: 100, isUploading: false });
  firebase
    .storage()
    .ref("images")
    .child(filename)
    .getDownloadURL()
    .then(url => this.setState({ avatarURL: url }));
};

  render() {
    const { auth } = this.props;
    if (!auth.uid) return <Redirect to='/signin' /> 
    return (
      <div className="container">
        <form className="white" onSubmit={this.handleSubmit}>
          <h5 className="grey-text text-darken-3">Create a New Ad</h5>
          <div className="input-field">
            <input type="text" id='title' onChange={this.handleChange} />
            <label htmlFor="title">Ad Title</label>
          </div>
          <div className="input-field">
            <textarea id="content" className="materialize-textarea" onChange={this.handleChange}></textarea>
            <label htmlFor="content">AdContent</label>
          </div>
          <div className="input-field">
            <input type="text" id='contactno' onChange={this.handleChange} />
            <label htmlFor="title">Contact Number</label>
          </div>


          { this.state.progress==100? <div class="col-md-4">
          <img class="responsive-img" src={this.state.avatarURL}></img>
          </div>:""}
          <br/>
          <label style={{backgroundColor: 'steelblue', color: 'white', padding: 10, borderRadius: 4, pointer: 'cursor'}}>
            Upload a photo

          {/* {this.state.isUploading && <p>Progress: {this.state.progress}</p>}
          {this.state.avatarURL && <img src={this.state.avatarURL} />} */}
            <FileUploader
              hidden
              accept="image/*"
              storageRef={firebase.storage().ref('images')}
              onUploadStart={this.handleUploadStart}
              onUploadError={this.handleUploadError}
              onUploadSuccess={this.handleUploadSuccess}
              onProgress={this.handleProgress}
            />
            </label>



          <div className="input-field">
            <button className="btn pink lighten-1">Create</button>
          </div>
        </form>
      </div>
    )
  }
}

const mapStateToProps = (state) => {
  return {
    auth: state.firebase.auth
  }
}

const mapDispatchToProps = dispatch => {
  return {
    createAd: (ad) => dispatch(createAd(ad))
  }
}

export default connect(mapStateToProps, mapDispatchToProps)(CreateAd)

import React，{Component}来自“React”
从“react redux”导入{connect}
从“../../store/actions/adActions”导入{createAd}
从“react router dom”导入{Redirect}
从“firebase”导入firebase；
从“react firebase文件上传器”导入文件上传器；
类CreateAd扩展组件{
状态={
标题：“”，
内容：“”，
化身：“，
isUploading:false，
进展：0，
化身：“，
联系电话：“
}
handleChange=（e）=>{
这是我的国家({
[e.target.id]：e.target.value
})
}
handleSubmit=（e）=>{
e、 预防默认值（）；
this.props.createAd（this.state）；
}
handleUploadStart=（）=>this.setState（{isUploading:true，progress:0}）；
handleProgress=progress=>this.setState（{progress}）；
handleUploadError=错误=>{
this.setState（{isUploading:false}）；
控制台错误（error）；
};
handleUploadSuccess=文件名=>{
this.setState（{avatar:filename，progress:100，isUploading:false}）；
火基
.储存
.ref（“图像”）
.child（文件名）
.getDownloadURL（）
.then（url=>this.setState（{avatarURL:url}））；
};
render（）{
const{auth}=this.props；
如果（！auth.uid）返回
返回(
创建新广告
广告标题
广告内容
联系电话
{this.state.progress==100？
:""}


上传照片
{/*{this.state.isUploading&进度：{this.state.Progress}
}
{this.state.avatarURL&&}*/}
创造
)
}
}
常量mapStateToProps=（状态）=>{
返回{
auth:state.firebase.auth
}
}
const mapDispatchToProps=调度=>{
返回{
createAd：（ad）=>调度（createAd（ad））
}
}
导出默认连接（mapStateToProps、mapDispatchToProps）（CreateAd）

---

这些是我的代码。

您应该使用

返回窗口。位置。替换（“/”

而不是

返回

---

“React Router Redirect”（反应路由器重定向）从A重定向到B，例如

如何使用

adReducer

？@SMAKSS您想知道什么？这很明显。您如何使用

adReducer

？如何在其他组件中调用并将参数传递给它？@SMAKSS上面我添加了adAction.js代码。它正在工作。但当我使用它时，它显示创建广告成功和创建广告错误警报。你知道为什么会这样吗？我相信这是你的两次行动。一个在它重定向之前，一个在它重定向之后。您是否有源代码，以便我可以查看并帮助您深入了解此问题？@F Pavanela我在问题中也添加了createAd代码。请参考

export const createAd = (ad) => {
  return (dispatch, getState, {getFirebase,getFirestore}) => {
  // make async call to database
  const firestore = getFirestore();
  const profile = getState().firebase.profile;
  const authorId = getState().firebase.auth.uid;
  firestore.collection('ads').add({
  ...ad,
  authorFirstName: profile.firstName,
  authorLastName: profile.lastName,
  authorId: authorId,
  createdAt: new Date()
  }).then(() => {
    dispatch({ type: 'CREATE_AD_SUCCESS' });
  }).catch(err => {
    dispatch({ type: 'CREATE_AD_ERROR' }, err);
  });
 }
};

import React, { Component } from 'react'
import { connect } from 'react-redux'
import { createAd } from '../../store/actions/adActions'
import { Redirect } from 'react-router-dom'
import firebase from "firebase";
import FileUploader from "react-firebase-file-uploader";

class CreateAd extends Component {
  state = {
    title: '',
    content: '',
    avatar: "",
    isUploading: false,
    progress: 0,
    avatarURL: "",
    contactno:""
  }
  handleChange = (e) => {
    this.setState({
      [e.target.id]: e.target.value
    })
  }
  handleSubmit = (e) => {
    e.preventDefault();
    this.props.createAd(this.state);
  }

handleUploadStart = () => this.setState({ isUploading: true, progress: 0 });
handleProgress = progress => this.setState({ progress });
handleUploadError = error => {
  this.setState({ isUploading: false });
  console.error(error);
};

handleUploadSuccess = filename => {
  this.setState({ avatar: filename, progress: 100, isUploading: false });
  firebase
    .storage()
    .ref("images")
    .child(filename)
    .getDownloadURL()
    .then(url => this.setState({ avatarURL: url }));
};

  render() {
    const { auth } = this.props;
    if (!auth.uid) return <Redirect to='/signin' /> 
    return (
      <div className="container">
        <form className="white" onSubmit={this.handleSubmit}>
          <h5 className="grey-text text-darken-3">Create a New Ad</h5>
          <div className="input-field">
            <input type="text" id='title' onChange={this.handleChange} />
            <label htmlFor="title">Ad Title</label>
          </div>
          <div className="input-field">
            <textarea id="content" className="materialize-textarea" onChange={this.handleChange}></textarea>
            <label htmlFor="content">AdContent</label>
          </div>
          <div className="input-field">
            <input type="text" id='contactno' onChange={this.handleChange} />
            <label htmlFor="title">Contact Number</label>
          </div>


          { this.state.progress==100? <div class="col-md-4">
          <img class="responsive-img" src={this.state.avatarURL}></img>
          </div>:""}
          <br/>
          <label style={{backgroundColor: 'steelblue', color: 'white', padding: 10, borderRadius: 4, pointer: 'cursor'}}>
            Upload a photo

          {/* {this.state.isUploading && <p>Progress: {this.state.progress}</p>}
          {this.state.avatarURL && <img src={this.state.avatarURL} />} */}
            <FileUploader
              hidden
              accept="image/*"
              storageRef={firebase.storage().ref('images')}
              onUploadStart={this.handleUploadStart}
              onUploadError={this.handleUploadError}
              onUploadSuccess={this.handleUploadSuccess}
              onProgress={this.handleProgress}
            />
            </label>



          <div className="input-field">
            <button className="btn pink lighten-1">Create</button>
          </div>
        </form>
      </div>
    )
  }
}

const mapStateToProps = (state) => {
  return {
    auth: state.firebase.auth
  }
}

const mapDispatchToProps = dispatch => {
  return {
    createAd: (ad) => dispatch(createAd(ad))
  }
}

export default connect(mapStateToProps, mapDispatchToProps)(CreateAd)