如何使用reactjs验证对象数组

import React, { useState } from 'react';

const MyComponent = () => {
  const [items, setItems] = useState([]);

  const handleInputChange = (index, property, value) => {
    const updatedItems = [...items];
    updatedItems[index][property] = value;
    setItems(updatedItems);
  };

  const handleSubmit = () => {
    // 遍历对象数组并进行验证
    items.forEach((item, index) => {
      if (!item.name) {
        // 如果name属性为空，则显示错误消息
        alert(`第${index + 1}个对象的name属性不能为空`);
      }
      // 其他验证逻辑...
    });
  };

  return (
    <div>
      {items.map((item, index) => (
        <div key={index}>
          <input
            type="text"
            value={item.name || ''}
            onChange={(e) => handleInputChange(index, 'name', e.target.value)}
          />
          {/* 其他输入字段... */}
        </div>
      ))}
      <button onClick={handleSubmit}>提交</button>
    </div>
  );
};

export default MyComponent;