Javascript 反应将类组件转换为功能组件不工作

我试图将我的类组件转换为函数组件，但它不起作用

问题来自这一行

previousLocation=this.props.location

如何在功能组件中替换它

class App extends Component {
    previousLocation = this.props.location; //the problem comes from here
    render() {
        const { location } = this.props;
        const isModal = !!(
            location.state &&
            location.state.modal &&
            this.previousLocation !== location
        );
        return (
            <div>
                <Switch location={isModal ? this.previousLocation : location}>
                    <Route exact path="/" component={Gallery} />
                    <Route exact path="/img/:id" component={Gallery} />
                    <Route exact path="/img" component={ModalPage} />
                </Switch>
                {isModal ? <Route path="/img/:id" component={ModalPage} /> : null}
            </div>
        );
    }
}

类应用程序扩展组件{
previousLocation=this.props.location；//问题出在这里
render（）{
const{location}=this.props；
常数isModal=(
位置、状态&&
位置、状态、模态&&
this.previousLocation！==位置
);
返回(
{isModal？:null}
);
}
}

我想做什么


const App = (props) => {
    const {previousLocation} = props.location;
    const {location} = props;
    const isModal = !!(
        location.state &&
        location.state.modal &&
        previousLocation !== location
    );
    return (
        <div>
            <Switch location={isModal ? previousLocation : location}>
                <Route exact path="/" component={Gallery}/>
                <Route exact path="/img/:id" component={Gallery}/>
                <Route exact path="/img" component={ModalPage}/>
            </Switch>
            {isModal ? <Route path="/img/:id" component={ModalPage}/> : null}
        </div>
    );
}


常量应用=（道具）=>{
const{previousLocation}=props.location；
const{location}=props；
常数isModal=(
位置、状态&&
位置、状态、模态&&
上一个位置！==位置
);
返回(
{isModal？:null}
);
}

用法：

const App = ({ location }) => {
  // get previous location and cache current location
  const previousLocation = usePrevious(location);

  const isModal = !!(
    location.state &&
    location.state.modal &&
    previousLocation !== location
  );

  return (
    <div>
      <Switch location={isModal ? previousLocation : location}>
        <Route exact path="/" component={Gallery}/>
        <Route exact path="/img/:id" component={Gallery}/>
        <Route exact path="/img" component={ModalPage}/>
      </Switch>
      {isModal ? <Route path="/img/:id" component={ModalPage}/> : null}
    </div>
  );
}

const-App=（{location}）=>{
//获取上一个位置并缓存当前位置
const previousLocation=useproval（位置）；
常数isModal=(
位置、状态&&
位置、状态、模态&&
上一个位置！==位置
);
返回(
{isModal？:null}
);
}

用法：

const App = ({ location }) => {
  // get previous location and cache current location
  const previousLocation = usePrevious(location);

  const isModal = !!(
    location.state &&
    location.state.modal &&
    previousLocation !== location
  );

  return (
    <div>
      <Switch location={isModal ? previousLocation : location}>
        <Route exact path="/" component={Gallery}/>
        <Route exact path="/img/:id" component={Gallery}/>
        <Route exact path="/img" component={ModalPage}/>
      </Switch>
      {isModal ? <Route path="/img/:id" component={ModalPage}/> : null}
    </div>
  );
}

const-App=（{location}）=>{
//获取上一个位置并缓存当前位置
const previousLocation=useproval（位置）；
常数isModal=(
位置、状态&&
位置、状态、模态&&
上一个位置！==位置
);
返回(
{isModal？:null}
);
}
您能否提供更详细的信息，说明哪些错误不起作用？您能否更具体地说明出现了哪些错误？或者应用程序组件上方的任何代码？我在同一屏幕中呈现一个模式，仅更改url，当我将类转换为functional时，该模式不再出现，它将推送到可能出现在modalcan中的路径。您可以提供更详细的关于什么不起作用的信息吗？您能否更具体地说明出现了什么错误？或者应用程序组件上方的任何代码？我在同一屏幕中呈现一个模式，仅更改url，当我将类转换为functional时，该模式不再出现，它推送到可能出现在modalThank You Agree@DrewReese中的路径。你真的帮了我很多哦，我以前帮过你！我想，“伙计，关于react钩子和尝试访问以前的值，一天中有两个问题的几率有多大。”随时都可以。再次感谢@DrewReese你真的帮了我很多哦，我之前确实帮过你！我会说，“伙计，一天内问两个关于react钩子和尝试访问先前值的问题的几率有多大。”随时都可以。