如何使用reactjs使用conatct类正确获取记录列表

Question

我下面有一个[[contact类，可以正常工作。

现在，我想向联系人类添加一个名为

Recordlist

的函数。当我按照以下方式将函数传递给componentDidMount（）函数时什么也没显示。如果我直接在联系人类下传递函数，它将抛出错误意外令牌。

componentDidMount(){
    function RecordList() {
        const userid = 101;
        const username = 'henry';
        alert(username);

        return (
            <ul>
                <b>Hey {username} the function is working</b>
            </ul>
        );
    }
}

请在联系人类中或其中添加和显示此功能的内容。任何解决方法将不胜感激
import React, { Component } from "react";
import ReactDOM from 'react-dom';


class Contact extends React.Component{
//class Contact extends Component {

    constructor(props) {
        super(props);

        this.state = {
            id: ''
        };
    }

    render() {
        return (
          <div>
             <h2>Hello welcome to contact page</h2>
          </div>
        );
    }
}

export default Contact;

Answer 1

import React, { Component } from "react";
import ReactDOM from 'react-dom';


class Contact extends React.Component{
    constructor(props) {
        super(props);

        this.state = {
            id: ''
        };
    }

    RecordList() {
        const userid = 101;
        const username = 'henry';

        return (
          <ul>
            <b>Hey {username} the function is working</b>
          </ul>
        );
    }

    render() {
        return (
          <div>
             <h2>Hello welcome to contact page</h2>
             {this.RecordList()}
          </div>
        );
    }
}

export default Contact;