Question

我制作了一个名为NewName的组件，其中有一个带有文本“ New”的按钮。我希望页面转到我制作的名为“ ProfileInformation”的第二个组件。

这是其中包含新按钮的“ NewName.js”组件

import React, { Component } from "react";

class NewName extends Component {


render() {
    return ( 
        <div>
            <button>New</button>
        </div>
    )
}
}


export default NewName

这是单击新按钮时要转到的组件。它具有其他组件。它是“ ProfileInformation.js”组件。

import React from 'react'
import UserDetail from "./UserDetail"
import ProfilePicture from "./ProfilePicture"
import UserName from "./UserName"

class ProfileInformation extends React.Component{
    render(){
        return(
            <div>
                <ProfilePicture />
                <UserName />
                <UserDetail />
            </div>
        )
    }
}

export default ProfileInformation

我希望在用户点击新按钮后在屏幕上呈现ProfileInformation组件。

Answer 1

您需要使用react-router在页面之间导航。这是官方页面：https://reacttraining.com/react-router/core/guides/quick-start

单击后如何实现显示下一页的事件？

1 个答案: