At present, there is a requirement to complete the CURD of SharePoint List. Based on past experience, I guess I can use Web Part to do it.

Proficient in environment building, project generation for reference

  • Use SharePoint framework for web part development

  • SharePoint framework development environment

  • SharePoint hosted workbench to achieve Rest interface to achieve asynchronous add, delete, change, and check

A problem was encountered. The request was not displayed in the network list. Some items could not get values

I ran into a problem that I was able to send requests to the SharePoint site, but while the requests I sent were visible on the Chrome console, only the 400 requests that I sent were displayed on the console in error. Other requests are not displayed on the network. I strongly suspect that the request is sent via SharePoint Client and therefore cannot be seen on Chrome Network (if I doubt this, I may be doing it the wrong way).

Try a solution

Go to the SharePoint documentation to find the correct API docs.microsoft.com/en-us/share…

 private _getListItems(): Promise<ICountryListItem[]> {
    return this.context.spHttpClient.get(
      //this.context.pageContext.web.absoluteUrl + `/_api/web/lists/getByTitle('Canvas-test')/items`,
      this.context.pageContext.web.absoluteUrl + `/_api/web/lists/getbytitle('Canvas-test')/items`,
      SPHttpClient.configurations.v1)
      .then(response => {
        return response.json();
      })
      .then(jsonResponse => {
        return jsonResponse.value;
      }) as Promise<ICountryListItem[]>;
  }
Copy the code

Verify that the official API is used to start debugging

Debug

Open the project in VSCode and find the terminal use command

gulp serve --nobrowser
Copy the code

The command is obviously not to open the browser to start the service, find where you want to break the point, F5 start debugging

Matters needing attention

If your project, like this one, uses data from a SharePoint site, you need to use a hosted workbench, which implements a Rest interface for asynchronous add, delete, change, and search

Debug can see that our API returns a JSON response of all the data

Find out why

The list of issuers is Name_x0028_issuer_x0029_. The list of issuer is Name_x0028_issuer_x0029_. The list of issuer is Name_x0028_issuer_x0029_

At this time think of ASCll code table query just () change the name to start the test

Perfect to

Lessons learned

Debug is a great way to ask to see data, much faster than to guess the problem. If you can’t get special characters, don’t doubt it. If you can get special characters, think of ASCII first. Still have no experience, take a long way around, solve a problem, not stupid.