如何在类组件中使用Link of react-router传递数据的组件中使用数据？

在类组件中使用Link组件传递数据，可以通过to属性传递一个对象，该对象包含了要传递的数据。然后在目标组件中，可以通过props.location.state来获取传递的数据。

以下是一个示例：

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

class ComponentA extends React.Component {
  render() {
    const data = {
      name: 'John',
      age: 25,
    };

    return (
      <Link to={{
        pathname: '/componentB',
        state: data,
      }}>
        Go to Component B
      </Link>
    );
  }
}

class ComponentB extends React.Component {
  render() {
    const { name, age } = this.props.location.state;

    return (
      <div>
        <h2>Component B</h2>
        <p>Name: {name}</p>
        <p>Age: {age}</p>
      </div>
    );
  }
}

在上面的示例中，ComponentA中使用Link组件传递了一个包含name和age属性的对象作为数据。在ComponentB中，通过this.props.location.state获取传递的数据，并展示在页面上。

这是使用react-router库的一种方式来在类组件中传递数据。react-router是一个用于处理路由的库，可以帮助我们构建单页应用。在这个示例中，我们使用了Link组件来实现路由跳转，并通过to属性传递数据。在目标组件中，可以通过props.location.state来获取传递的数据。

腾讯云相关产品和产品介绍链接地址：