reactjs - React Typescript:从文件输入中获取文件
问题描述
我得到的错误是Property 'files' does not exist on type 'ChangeEvent<HTMLInputElement>
为什么我不能从文件输入中访问文件数组?
这是可以使用 useRef 的情况吗?
import React from 'react';
const Photo: React.FC = () => {
const [state, setState] = useState({
photo: '',
});
const {
photo,
} = state;
const onChange = (event: React.ChangeEvent<HTMLInputElement>) => {
'ChangeEvent<HTMLInputElement>
event.persist();
setState((prev) => ({
...prev,
[event.target.id]: event.target.value,
}));
console.log(state.photo) // returns nothing
console.log(event.files[0]);
// ^
// Property 'files' does not exist on type
};
return (
<div className='photo'>
<label>
Click Me
<input
type='file'
id='photo'
name='photo'
accept='image/png, image/jpeg'
onChange={onChange}
value={photo}
></input>
</label>
</div>
);
};
解决方案
files
是输入 ( HTMLInputElement
) 的属性,而不是事件的属性。
所以应该是event.currentTarget.files
推荐阅读
- android - 如何在高度不均匀的 CardView 之间提供相等的间距?
- angular - Angular CLI v6:“未知选项:'--bh'”
- visual-studio - 替代 stringstream 以提高速度
- c# - BackgroundWorker 的进度条不起作用
- python-2.7 - python 2.7中没有模块名称csv错误
- javascript - 如何使用切片获取给定范围之间的数据
- linux - Unix - 执行命令时预期不工作
- vb.net - vb.net 消息框单击行为与输入键不同
- magento - Magento 2 将自定义字段添加到销售订单导出 csv 问题
- android - 使用测试凭据从 WebView 获取事务 (Plaid)