React does not recognize the suffixCls prop on a DOM element

这个问题通常出现在使用 Ant Design 组件库时，因为 Ant Design 组件库中的一些组件会为 DOM 元素添加一些自定义的属性，其中包括 suffixCls。但是 React 并不认识这些自定义属性，因此会报出这个警告。

解决这个问题的方法就是使用 Ant Design 提供的组件而不是直接使用 DOM 元素，并且不要为 DOM 元素传递 Ant Design 组件的 props。如果你需要为 DOM 元素设置样式，可以使用 className 或 style 属性。

如果你仍然需要为 DOM 元素传递 Ant Design 组件的 props，你可以使用 React 提供的属性转发机制。具体来说，你可以使用 React.forwardRef() 函数来创建一个包装组件，将 props 转发给内部的 DOM 元素。例如：

import React from 'react';
import { Button } from 'antd';

const MyButton = React.forwardRef((props, ref) => {
  return <button ref={ref} {...props} />;
});

function App() {
  return (
    <div>
      <Button suffixCls="my-suffix" />
      <MyButton suffixCls="my-suffix" />
    </div>
  );
}

在这个例子中，我们创建了一个名为 MyButton 的组件，使用 React.forwardRef() 将 props 转发给内部的 button 元素。然后我们可以像使用 Button 组件一样使用 MyButton 组件，并且可以为其传递 suffixCls 属性，同时不会报出警告。