设置状态本身时不能使用此. state。这根本不起作用。
在您的示例中，如果imagesArray在执行过程中不会更改，并且您只需要一些数据，则可能不需要将其设置为组件状态的一部分。
您可以将imagesArray定义为类外部的常量或类似的内容，并在设置tabData时引用它。

• • 编辑：**

更重要的是，如果tabData只是你以后需要的数据，但它不会改变，你也不需要把它设置为state。

• • EDIT 2：**如果这两个数组确实需要处于状态，则实现所需结果的一种方法是在每个tabData项的'content'属性中仅定义组件名称，然后使用该名称在render方法中示例化它：

tabData: [
  {
   title: 'Knowledge and experience',
   content: VolunteerTabContent1
  }, 
  ...

然后在render方法中你可以做

// Let's suppose you want the first one as an example. Do this as you need.
const item = this.state.tabData[0];

render() {
  <item.content imagesArray={this.state.imagesArray} />
}

这样，您将正确地从状态中获取imagesArray。JSX将获取item.content的值（在本例中为VolunteerTabContent1组件）并呈现它。

I will show in functional component it will useful for someone.

import "./styles.css";
import image1 from '../image/man.png';
import image2 from '../image/woman.png';
import React,{useState} from 'react';`enter code here`
import Avatar from '@mui/material/Avatar';

export default function App() {

  const [choose,setChoose] =useState("")
const [avatar,setAvatar] = useState(image);

  return (
    <div className="App">
       
      <Avatar 
        alt="D S"
        src={avatar}
        sx={{ width: 44, height: 44 }}
      />
     
       <div>
          <Avatar className='Avatars' onClick={()=> setChoose(image1)} alt="Guest"
           src={image1} sx={{ width: 30, height: 30 }}/>
           <label>Guest</label>
           </div>
        <div>
          <Avatar className='Avatars' onClick={()=> setChoose(image2)} alt="Other" 
          src={image2} sx={{ width: 30, height: 30 }}/>
          <label>Other</label>
          </div>
          <div>
          <button className="avatar_btn1" onClick={()=>setAvatar(choose)} >OK</button>
          </div>
    </div>
  );
}

from my code first you can choose a avatar it will not change in frontend when you click ok button it will show avatar changed one.