账号密码登录
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
找回密码返回
邮箱找回 手机找回
注册账号返回
其他登录方式
分享
  • 收藏
    X
    react-router v6如何给类组件传递路由参数?
    51
    0
    请问react-router v6如何给类组件传递路由参数?谢谢
    0
    打赏
    收藏
    点击回答
        全部回答
    • 0
    • 在React Router v6中,类组件可以通过props属性来传递路由参数。以下是一个简单的例子:

      ```jsx import React from 'react'; import { BrowserRouter as Router, Route, Switch } from 'react-router-dom';

      class App extends React.Component { constructor(props) { super(props); this.state = { message: props.message, }; }

      componentDidMount() { this.setState({ message: 'Hello, World!' }); }

      render() { return (

      {this.state.message}

      ); } }

      class User extends React.Component { constructor(props) { super(props); this.state = { name: props.name, }; }

      render() { return (

      {this.state.name}

      ); } }

      class Product extends React.Component { constructor(props) { super(props); this.state = { price: props.price, }; }

      render() { return (

      {this.state.price}

      ); } }

      export default App; ```

      在这个例子中,我们创建了三个类组件:User,Product和App。每个类组件都有一个props属性message,它包含了我们在路由中设置的message参数。

      在render方法中,我们使用props属性来更新组件的状态,并在组件的末尾显示这个状态。

      然后,我们创建了一个Route组件,它包含一个Switch组件,这个Switch组件的path属性设置为"/api/user/:id",它包含了我们在路由中设置的id参数。我们在User组件和Product组件中都设置了props属性message,所以它们都会显示设置的message参数。

    更多回答
    扫一扫访问手机版
    • 回到顶部
    • 回到顶部