react中使用js获取 循环出的变量id

最近遇到点问题，得用到js获取id，而且id的值不是常量。

语言：react+js        编译器：VS code        环境：macOS Big Sur

界面就三个按钮：

控制台看结果：

 

代码：

import React, { Component } from 'react';

export default class Test extends Component {

    constructor(props) {
        super(props);
        this.state = {
            ids: [3, 2, 8]
        }
    }

    componentDidMount() {
    }

    audiod(id) {
        let audioIds = document.getElementById(id)
        console.log('audioIds', audioIds);
    }

    render() {
        return (
            <div>
                {
                    this.state.ids.map((content, id) => {
                        console.log('id', id);
                        return (
                            <button id={id} onClick={this.audiod(id)}
                            >
                                {content}
                            </button>
                        )
                    })
                }
            </div>
        )
    }
}