У меня есть приложение для реагирования, и у меня есть этот код, но похоже, что метод fetchdata полон синтаксических ошибок, первая из которых указана в заголовке вопроса.
Что не так с методом?
import React, { Component } from 'react';
import { Row, Col } from 'antd';
import PageHeader from '../../components/utility/pageHeader';
import Box from '../../components/utility/box';
import LayoutWrapper from '../../components/utility/layoutWrapper.js';
import ContentHolder from '../../components/utility/contentHolder';
import basicStyle from '../../settings/basicStyle';
import IntlMessages from '../../components/utility/intlMessages';
import { adalApiFetch } from '../../adalConfig';
const data = {
TenantId: this.this.state.tenantid,
TenanrUrl: this.state.tenanturl,
TenantPassword: this.state.tenantpassword
};
const options = {
method: 'post',
data: data,
config: {
headers: {
'Content-Type': 'multipart/form-data'
}
}
};
export default class extends Component {
constructor(props) {
super(props);
this.state = {value: ''};
this.handleChangeEventTenantUrl = this.handleChangeEventTenantUrl.bind(this);
this.handleChangeEventTenantPassword = this.handleChangeEventTenantPassword.bind(this);
this.handleChangeEventTenantId= this.handleChangeEventTenantId.bind(this);
this.handleSubmit = this.handleSubmit.bind(this);
}
handleChangeEventTenantUrl(event){
this.setState({tenanturl: event.target.value});
}
handleChangeEventTenantPassword(event){
this.setState({tenantpassword: event.target.value});
}
handleChangeEventTenantId(event){
this.setState({tenantid: event.target.value});
}
handleSubmit(event){
alert('A name was submitted: ' + this.state.value);
event.preventDefault();
fetchData();
}
fetchData = () => {
adalApiFetch(fetch, "/tenant", options)
.then(response => response.json())
.then(responseJson => {
if (!this.isCancelled) {
this.setState({ data: responseJson });
}
})
.catch(error => {
console.error(error);
});
};
upload(e) {
let data = new FormData();
//Append files to form data
let files = e.target.files;
for (let i = 0; i < files.length; i++) {
data.append('files', files[i], files[i].name);
}
let d = {
method: 'post',
url: API_SERVER,
data: data,
config: {
headers: {
'Content-Type': 'multipart/form-data'
},
},
onUploadProgress: (eve) => {
let progress = utility.UploadProgress(eve);
if (progress == 100) {
console.info("Done");
} else {
console.info("Uploading...",progress);
}
},
};
let req = axios(d);
return new Promise((resolve)=>{
req.then((res)=>{
return resolve(res.data);
});
});
}
render(){
const { data } = this.state;
const { rowStyle, colStyle, gutter } = basicStyle;
return (
<div>
<LayoutWrapper>
<PageHeader>{<IntlMessages id = "pageTitles.TenantAdministration" />}</PageHeader>
<Row style = {rowStyle} gutter = {gutter} justify = "start">
<Col md = {12} sm = {12} xs = {24} style = {colStyle}>
<Box
title = {<IntlMessages id = "pageTitles.TenantAdministration" />}
subtitle = {<IntlMessages id = "pageTitles.TenantAdministration" />}
>
<ContentHolder>
<form onSubmit = {this.handleSubmit}>
<label>
TenantId:
<input type = "text" value = {this.state.tenantid} onChange = {this.handleChangeEventTenantId} />
</label>
<label>
TenantUrl:
<input type = "text" value = {this.state.tenanturl} onChange = {this.handleChangeEventTenantUrl} />
</label>
<label>
TenantPassword:
<input type = "text" value = {this.state.tenantpassword} onChange = {this.handleChangeEventTenantPassword} />
</label>
<label>
Certificate:
<input onChange = { e => this.upload(e) } type = "file" id = "files" ref = { file => this.fileUpload } />
</label>
<input type = "submit" value = "Submit" />
</form>
</ContentHolder>
</Box>
</Col>
</Row>
</LayoutWrapper>
</div>
);
}
}



![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)


Вы написали свой метод fetchData в форме class property, который еще не является частью языка. Вы можете добавить плагин Babel свойства класса преобразования или пресет, в котором он есть, например предварительная установка этапа 2.
Если вы не хотите настраивать Babel, вы можете вместо этого привязать метод в своем конструкторе, как вы это делали с другими вашими методами:
export default class extends Component {
constructor(props) {
super(props);
this.state = {value: ''};
this.handleChangeEventTenantUrl = this.handleChangeEventTenantUrl.bind(this);
this.handleChangeEventTenantPassword = this.handleChangeEventTenantPassword.bind(this);
this.handleChangeEventTenantId= this.handleChangeEventTenantId.bind(this);
this.handleSubmit = this.handleSubmit.bind(this);
this.fetchData = this.fetchData.bind(this);
}
fetchData() {
adalApiFetch(fetch, "/tenant", options)
.then(response => response.json())
.then(responseJson => {
if (!this.isCancelled) {
this.setState({ data: responseJson });
}
})
.catch(error => {
console.error(error);
});
}
// ...
}
Вы определили переменную fetchdata ранее? Если нет, возможно, вам следует сделать это в текущей строке:
var fetchdata = () => { ...