Uncaught ReferenceError: GetListItems is not defined
Uncaught ReferenceError: GetListItems is not defined
我正在使用 React 处理 SPFx,我正在尝试使用 REST 调用获取包含超过 5000 个项目的共享点列表项目。
但是,当我这样做时,它会转到成功函数并检索指定的前 1000 个项目。但是在接下来的迭代中,在指定行弹出这个错误-
Uncaught ReferenceError: GetListItems is not defined
我做错了什么?请帮忙
public componentDidMount() {
this.GetListItems();
}
public GetListItems() {
var reactHandler = this;
var response = response || []; // this variable is used for storing list items
var url = '${this.props.siteurl}/_api/web/lists/getbytitle('List_name')/items?$top=1000';
jquery.ajax({
url: url,
method: "GET",
headers: {
"Accept": "application/json; odata=verbose"
},
success: function(data) {
console.log("Data ;", data.d.results);
response = response.concat(data.d.results);
console.log("Items are1;", response);
if (data.d.__next) {
url = data.d.__next;
this.GetListItems(); // error in this line
console.log("concat", this.response);
} else {
return response;
}
reactHandler.setState({
items: response,
filteredItems: response
}, () => {
console.log("Items are;", this.state.items);
});
},
error: function(error) {
// error handler code goes here
console.log("error")
}
});
}
我直接用js测试代码
我对代码做了一些修改,供大家参考:
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script>
$(function () {
var url = `${_spPageContextInfo.siteAbsoluteUrl}/_api/web/lists/getbytitle('testn')/items?$top=1000`;
GetListItems(url)
})
var response = response || [];
function GetListItems(url) {
$.ajax({
url: url,
method: "GET",
headers: {
"Accept": "application/json; odata=verbose"
},
success: function (data) {
console.log("Data ;", data.d.results.length);
response = response.concat(data.d.results);
console.log("Items are1;", response);
if (data.d.__next) {
url = data.d.__next;
GetListItems(url); // error in this line
console.log("concat",response);
} else {
return response;
}
// reactHandler.setState({
// items: response,
// filteredItems: response
// }, () => {
// console.log("Items are;", this.state.items);
// });
},
error: function (error) {
// error handler code goes here
console.log("error")
}
})
}
</script>
测试结果:
更新:
更新代码:
this.state={
Response:[]
}
var Response=this.state.Response;
Response.concat(data.d.results);
this.setState({Response})
终于知道哪里不对了!这是一个范围问题,因为我在成功函数中使用了 ES5 语法。我将其更改为 ES6,即,使用了箭头函数。这是我更新的代码-
public componentDidMount() {
var response = response || []; // this variable is used for storing list items
var url = `${this.props.siteurl}/_api/web/lists/getbytitle('List_Name')/items?$top=1000`;
this.GetItems(response, url);
}
public GetItems = (response, url) => {
jquery.ajax({
url: url,
method: "GET",
headers: {
"Accept": "application/json; odata=verbose"
},
success: (data) => {
console.log("Data ;", data.d.results);
response = response.concat(data.d.results);
console.log("Items are;", response);
if (data.d.__next) {
url = data.d.__next;
this.GetItems(response, url);
console.log("concat", response.length);
}
this.setState({
items: response,
filteredItems: response
}, () => {
console.log("Items are;", this.state.items);
});
},
error: function (error) {
// error handler code goes here
console.log("error")
}
});
}
我正在使用 React 处理 SPFx,我正在尝试使用 REST 调用获取包含超过 5000 个项目的共享点列表项目。
但是,当我这样做时,它会转到成功函数并检索指定的前 1000 个项目。但是在接下来的迭代中,在指定行弹出这个错误-
Uncaught ReferenceError: GetListItems is not defined
我做错了什么?请帮忙
public componentDidMount() {
this.GetListItems();
}
public GetListItems() {
var reactHandler = this;
var response = response || []; // this variable is used for storing list items
var url = '${this.props.siteurl}/_api/web/lists/getbytitle('List_name')/items?$top=1000';
jquery.ajax({
url: url,
method: "GET",
headers: {
"Accept": "application/json; odata=verbose"
},
success: function(data) {
console.log("Data ;", data.d.results);
response = response.concat(data.d.results);
console.log("Items are1;", response);
if (data.d.__next) {
url = data.d.__next;
this.GetListItems(); // error in this line
console.log("concat", this.response);
} else {
return response;
}
reactHandler.setState({
items: response,
filteredItems: response
}, () => {
console.log("Items are;", this.state.items);
});
},
error: function(error) {
// error handler code goes here
console.log("error")
}
});
}
我直接用js测试代码
我对代码做了一些修改,供大家参考:
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script>
$(function () {
var url = `${_spPageContextInfo.siteAbsoluteUrl}/_api/web/lists/getbytitle('testn')/items?$top=1000`;
GetListItems(url)
})
var response = response || [];
function GetListItems(url) {
$.ajax({
url: url,
method: "GET",
headers: {
"Accept": "application/json; odata=verbose"
},
success: function (data) {
console.log("Data ;", data.d.results.length);
response = response.concat(data.d.results);
console.log("Items are1;", response);
if (data.d.__next) {
url = data.d.__next;
GetListItems(url); // error in this line
console.log("concat",response);
} else {
return response;
}
// reactHandler.setState({
// items: response,
// filteredItems: response
// }, () => {
// console.log("Items are;", this.state.items);
// });
},
error: function (error) {
// error handler code goes here
console.log("error")
}
})
}
</script>
测试结果:
this.state={
Response:[]
}
var Response=this.state.Response;
Response.concat(data.d.results);
this.setState({Response})
终于知道哪里不对了!这是一个范围问题,因为我在成功函数中使用了 ES5 语法。我将其更改为 ES6,即,使用了箭头函数。这是我更新的代码-
public componentDidMount() {
var response = response || []; // this variable is used for storing list items
var url = `${this.props.siteurl}/_api/web/lists/getbytitle('List_Name')/items?$top=1000`;
this.GetItems(response, url);
}
public GetItems = (response, url) => {
jquery.ajax({
url: url,
method: "GET",
headers: {
"Accept": "application/json; odata=verbose"
},
success: (data) => {
console.log("Data ;", data.d.results);
response = response.concat(data.d.results);
console.log("Items are;", response);
if (data.d.__next) {
url = data.d.__next;
this.GetItems(response, url);
console.log("concat", response.length);
}
this.setState({
items: response,
filteredItems: response
}, () => {
console.log("Items are;", this.state.items);
});
},
error: function (error) {
// error handler code goes here
console.log("error")
}
});
}