小编Shi*_*ira的帖子

我正在尝试在我的 React 表中实现日期范围过滤器。当我更改开始或结束日期时，它会触发过滤功能，创建最小和最大日期，但当它完成时，不会过滤任何日期，并且输入从所选日期开始为空。这是我的代码：

const ChartData = () => {
const columns = React.useMemo(
() => [
  {
    Header: "Date",
    columns: [
      {
        Header: "Date",
        accessor: "date",
        id: "date",
        Filter: chartFilter.DateRangeColumnFilter,
        filter: "between"
      }
    ]
  }
],
[]
);

const data = React.useMemo(() => dummyData(100000), []);

return (
   <div className={classes.tableWrapper}>
      <Table columns={columns} data={data} />
   </div>
 );
};
export default ChartData;

过滤页面：

  export function DateRangeColumnFilter({
     column: { filterValue = [], preFilteredRows, setFilter, id }
     }) {
     const [min, max] = React.useMemo(() => …

我正在将我的反应项目更改为 react-typescript。我已经创建了 tsconfig 和 eslintrc 并且一切准备就绪并且可以工作。我还将我所有的 js 文件更改为 tsx 文件。但是现在我收到一个它无法识别的错误，import App from "./App"我需要添加 .tsx "./App.tsx"。我知道我可以更改 webpack 配置文件，并添加了以下内容：

module.exports = {
resolve: {
    enforceExtension: false,
    extensions: ['.ts', '.tsx', '.js', '.json'],
},
};

但它没有帮助，仍然得到同样的错误。如何更改配置文件以便它知道读取 .tsx 文件？我应该更改 eslintrc 吗？配置？还是webpack？谢谢

Ps 我使用了 Create React App 所以我已经有了默认的 webpack 配置

我似乎找不到我做错了什么......任何帮助将不胜感激：

type Props = {
  onClick: () => void, 
  value: string
}

const CustomInput = forwardRef<Props>(({ onClick, value }, ref) => (
  <div className="react-datepicker-custom-input" onClick={onClick}>
    {value}
    <i className={classes.arrowDown}></i>
  </div>
));


error message: Property 'onClick' does not exist on type '{ children?: ReactNode; }

导出默认的自定义输入；