如何从reactjs中的B类获取A类的数据

Question

在这里，我添加了两个类，并希望从一个类获取数据到另一个类，但是我收到了这样的错误：“警告:函数作为一个React子函数无效。如果您返回一个组件而不是呈现，或者您打算调用这个函数而不是返回它。”

import React, { Component } from 'react';
import DataHtml from "../datahtml";


export default class AllData extends Component {
    render(){
        return (
            <div className="row g-6 g-xl-9">
                <DataHtml />
            </div>
        );
    }
}


import React, { Component } from 'react';

class DataHtml extends Component {
    constructor(props) {
        super(props)

        this.state = {
            data: [ {"name": "demo","date": "02-02-2022"},{"name": "demo","date": "02-02-2022"}]        
            }
    }

    DataHtmlStructure = () => {
        this.state.data.map((data) => {
            return (
                <div className="col-md-6 col-xl-4 test-card">
                    <div className="card-body p-9 pt-4">
                        <div className="fs-3 fw-bolder text-dark mb-1">{data.name}</div>
                        <div className="fs-5 text-gray-600">
                            <i className="bi bi-calendar-date-fill"></i>{data.date}
                        </div>
                    </div>
                </div>
            );
        })
    }

    render() {
        return this.DataHtmlStructure;
    }
}
export default DataHtml;

Answer 1

您需要在render方法中调用函数。

    render() {
        return this.DataHtmlStructure();
    }