как передать реквизиты response-router-dom и обычные реквизиты

Question

Я знаю, как использовать реквизиты response-router-dom. это похоже на это

import React from 'react';
import { RouteComponentProps } from 'react-router-dom';

const  AAA : React.FC<RouteComponentProps> = ({history}) => {
.
.
.
}

, и я знаю, как использовать реквизиты, отправленные родительским компонентом, например,

import React from 'react';

const AAA = props => {
.
.
.
}

, но я не знаю, как использовать оба из них.

дайте, пожалуйста, совет.

Answer 1

Когда вы выполняете деструктуризацию объекта. У вас будет доступ только к свойствам, которые вы укажете.

Поскольку все реквизиты, передаваемые компоненту, доступны через аргумент, который конструктор получает обычно как props, вы можете получить к ним доступ через props.prop_name

Если у вас есть ChildComponent, внутри которого вы хотите иметь доступ к router свойствам, таким как история, местоположение, совпадение и свойствам, которые он получает от своего родителя, вы можете выполнить это следующим образом.

учтите, что в ParentComponent вы визуализируете ChildComponent вот так

<ChildComponent name="The child component" />

Чтобы получить доступ как к параметру router, так и к реквизитам, полученным от родителя, вы делаете это

import { withRouter } from 'react-router-dom';

const ChildComponent = (props) => {

    // Here you have access to react-router-dom parameter

    const {history, location, match} = props;

    return <div>
         
         {/* 
             to access name props receive from the parent
             component you perform it like below 
         */}

         {props.name} 

    </div>
}

export default withRouter(ChildComponent);

Answer 2

{history} prop, который вы используете, использует деструктуризацию объекта.

Вы можете сделать это:

1. Вы можете напрямую использовать history и sampleProp в своем код.

<ChildComponent samepleProp />

const ChildComponent = ({history, samepleProp}) = {}

Или вы можете сделать это так.

Вы должны использовать props.history и props.sampleProp

<ChildComponent samepleProp />

const ChildComponent = (props) = {}