Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/423.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181

Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/html/69.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181

Warning: file_get_contents(/data/phpspider/zhask/data//catemap/4/json/13.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 文件上载时无法访问路径密钥_Javascript_Html_Image_Reactjs - Fatal编程技术网

Javascript 文件上载时无法访问路径密钥

Javascript 文件上载时无法访问路径密钥,javascript,html,image,reactjs,Javascript,Html,Image,Reactjs,我正在尝试访问HTMLElementInput.files.path以发送到我的后端进行cloudinary处理。我遇到的问题是对象上现在存在path键 我一直在阅读,我很确定我没有做任何错误的标记。下面是我用来截取输入数据的代码: class App extends Component { capture(e) { e.preventDefault(); const image = document.querySelector('input').files[0];

我正在尝试访问
HTMLElementInput.files.path
以发送到我的后端进行
cloudinary
处理。我遇到的问题是对象上现在存在
path

我一直在阅读,我很确定我没有做任何错误的标记。下面是我用来截取
输入数据的代码:

class App extends Component {
  capture(e) {
    e.preventDefault();
    const image = document.querySelector('input').files[0];
    console.log(image);
    // image.path === undefined
  }
  render() {
    return (
      <div className="App">
        <div className="App-header">
          <img src={logo} className="App-logo" alt="logo" />
          <h2>Welcome to React</h2>
        </div>
        <form onSubmit={e => this.capture(e)}>
          <div>
            <label htmlFor="photo_image">Upload an image</label>
            <input id="photo_image" type="file" accept=".jpg, .jpeg, .png" />
          </div>
          <button type="submit">Submit</button>
        </form>
      </div>
    );
   }
}

export default App;
类应用程序扩展组件{
捕获(e){
e、 预防默认值();
const image=document.querySelector('input')。文件[0];
console.log(图像);
//image.path==未定义
}
render(){
返回(
欢迎反应
这个。捕获(e)}>
上传图像
提交
);
}
}
导出默认应用程序;
我被难住了。如果有人看到我哪里出了问题,或者我不知道
react
有什么问题,我会洗耳恭听

更新 对不起,我应该在这之前留下这些信息。项目通过
create react app
引导。我在开发和为内置产品服务时都遇到了这个问题

  • create-react-app@1.3.3
  • 反应-scripts@1.0.10
  • node@8.2.1
  • yarn@0.27.5
  • macOS@10.12.6
  • chrome@59.0.3071.115

在Submit上捕获事件时,缺少事件周围的括号。将其更改为以下代码,然后重试:

<form onSubmit= {(e) => this.capture(e)}>
this.capture(e)}>

我当时仍处于
electron
的心态,从未想过MDN告诉我,出于安全原因,浏览器不允许我访问系统上文件的硬路径这一事实。在Reactiflux中发送给我的这个代码框显示了一种获得我所寻找的最终目标的方法,非常感谢@BTM:


使用ES6,您在传递单个参数时不需要括号感谢您更新我在这方面的知识。