js获取本地文件

采用动态注入标签获取本地文件，好处在于不用编写固定的input框样式获取文件,在哪个便签上都可以绑定方法获取文件。

基础方法

/**

 * 获取本地文件

 * @param callback 文件回调函数

 * @param accept 接受选择问价类型

 */

export function getLocalFile(callback) {
    // 创建获取文件input标签
    const fileInput = document.createElement('input');
    fileInput.className="sys_file_input";
    // 设置input类型
    fileInput.type = "file";
    // 处罚点击事件
    fileInput.click();
    // 监听选中文件
    fileInput.onchange = ({ target: { files } }) => {
        callback && callback(files);
        // 移除文件标签
        fileInput.remove();
    };
    // 追加至应用
    document.body.append(fileInput)
}

未移除标签样式

.sys_file_input{
	display: block;
	height: 0;
	width: 0;
	font-size: 0;
	overflow: hidden;
	opacity: 0;
}