Questions tagged [react-webpart]

The tag has no usage guidance.

Filter by
Sorted by
Tagged with
0
votes
0answers
16 views

How to prioritise loading of one web part in SPFx?

I have a SharePoint modern page on which I have a couple of web parts installed. The web part on top is a carousel that needs to be rendered first. The problem I am facing is that when the page is ...
0
votes
0answers
51 views

Typeerror : failed to fetch in pnpjs in Sharepoint SPFx webpart

I have written below code in SPFx Webpart to upload file to Sharepoint Library. It gives me error sometimes like TypeError : Failed to fetch. Can anyone give me some idea what this error signifies and ...
1
vote
0answers
40 views

SPFX Uncaught TypeError: state.Array.slice is not a function

Code where the error occurs: const initialState: IUserProfileState = { useremail: '', status: '', //items: {} as IListItem[], EmpID: '', ExeArray : {} as IArrayItem[]...
0
votes
2answers
46 views

SPFX ClientSideAssets folder and dist folders have old code

When I build my solution, minified JS files have my old lines. Here are my steps: 1 - gulp clean 2 - gulp build 3 - gulp bundle 4 - gulp package-solution --ship file under \dist\test-web-part.js file ...
1
vote
1answer
52 views

Hide table column from property pane (WebPart)

I am still new into the WebPart development so bare with me: I have created a WebPart consisting of table and I have several toggles in the settings that can show hide a column in the table. Somehow I ...
1
vote
1answer
140 views

Fetch multiple images from SharePoint library and display images in SPFX webpart

SharePoint Library -- Multiple image and HexID field I am able to display one image by giving full URL of images but i have to filter the images based on HexID, But I am not sure how to apply filter, ...
0
votes
1answer
141 views

Using PnPJS Library to display list of data

I'm building a SPFX React webpart. I currently have the webpart on my SharePoint site's workbench page. Here is the code that I'm currently using: private _renderListAsync(): void { // Local ...
1
vote
1answer
314 views

How do I get the selected value text(display name) from the web-part Property pane dropdown?

I have a Web-part that I would like to show a title on the component that is dynamically populated from the selected value from a property pane drop down. I am able to get the value from this....
5
votes
1answer
342 views

Rich Text Editor Control for React with IE 11 Support

I want to implement an SPFX web part with React using which user can provide their view on the given questions. Users should be able to add images or links or use formatting for the text to provide ...
1
vote
1answer
461 views

ReactDom render multiple elements spfx

Let me start by saying I am working on my first webpart and learning react spfx. I am trying to render multiple elements using ReactDom.render. How do I render both the elements on the same .ts file? ...
0
votes
2answers
451 views

SPFX - calling async function - Missing properties

I'm trying to create a modern webpart that connects to MSGraphClient using the UI Fabric, to create quick access to files. I'm getting the follow error calling an async function with _allItems (...
1
vote
1answer
396 views

Handle failure response on SharePoint list item add using PnP JS

I have created one SPFx web part with React framework to add the items from .CSV file to SharePoint list using PnP JS. I have used PnP JS item.add() method to add the item in the list by looping each ...
0
votes
2answers
338 views

React Calendar gives Error on Internet Explorer 11

I am new to SP dev fx components and have used react-calendar linked react-calendar. I works fine on Chrome, Firefox but gives error Object doesn't support property or method 'from' on Internet ...
0
votes
1answer
322 views

Where to add an event listener when using SPFx and React

Which is the preferred place to add an event listener in your code if you're using SPFx and React? The .ts file or the .tsx file? And which function, componentDidMount, getInitialState, render? The ...
0
votes
1answer
509 views

Dynamically Pass List item parameter using pnp js

I have created SPFx web part using React JS framework. I am reading the data from the CSV file and adding item to SharePoint list using inBatch in PnP JS. I was able to add the item to SharePoint ...
0
votes
1answer
940 views

Image Carousel Spfx webpart

Hi I am working on SPFx image carousel web-part using react responsive carousel. I want that if user click on image on carousel it will show detail description of image in modal dialog on same page: ...
0
votes
1answer
594 views

How re-render react when toggle properties change

I'm using spfx and react, i have toggle on WebPart properties, and i want to re redner when toggle was change in the .Ts page not in Tsx, i have no idea how to do this, there is no SetState on .ts. I ...
0
votes
1answer
419 views

SPFx React REST API 403 error

I have created SPFx webpart with React. I am calling REST API to get documents from document library and it's work perfectly in workbench but in SharePoint page i am getting error 403 - Forbidden ...
0
votes
1answer
75 views

Empty “URL” does not load SPFx web-part

I am creating SPFx web-part in which I am using office fabric to bind SharePoint image link (hyperlink column). Web-part works fine if all values present. If hyperlink column is blank web-part does ...
1
vote
1answer
318 views

SPFX 404 When Trying to Get Current User In Workbench

I'm trying to get the user context in my React webpart and am getting 404's when requesting: https://localhost:4321/_api/web/currentuser This is the part of the code that fetches the current user: ...
1
vote
1answer
732 views

Migrate Current React JS Project to Run in Sharepoint

Our team has created a React SPA that is js based as opposed to ts. From what I've seen, creating and utilizing a webpart requires typescript. This project is fairly large so I guess I'm just ...
0
votes
2answers
2k views

How to create common scss file in SPFx solution?

I have created SPFx solution which contains multiple webparts (Four webparts in 1 solution). All the webparts design are similar but with different logic. Right now, I have created a duplicate file ...
4
votes
1answer
20k views

Anyone can explain the .ts file and .tsx file use and difference in SPFx react webpart?

In SPFx No JavaScript Framework webpart contain "webpart.ts" file and write code in it. But in React SPFx webpart, there are 2 file : 1) webpart.ts file 2) webpart.tsx file in component folder. ...
-1
votes
1answer
146 views

Debounce in sfx react

The code I am using: <TextField onChanged={e => this.handleCommChange(e, 'Contact')} private handleCommChange(e: any, controlType: any): void { const { temp_items } = this.state; const ...
1
vote
1answer
134 views

I want to upload the document in SharePoint online document library with content type

My code - sp.web .getFolderByServerRelativeUrl("Student%20Details%20No%20Content%20Type") .files.add(fileContent.name, fileContent, true) .then(f => { f.file.getItem()....
1
vote
0answers
164 views

Unable to print result in spfx react (got the data)

Getting data from SPFX React (json) - this.state = { testProperty1: "", hideDialog: true, showModal: false, items: [ { Id: "", title: "", ...
1
vote
1answer
195 views

Unable to open popup in spfx react

<div className="backdrop" style={this.backdropStyle}> <div className="modal" style={this.modalStyle}> {this.props.children} <...
1
vote
1answer
1k views

Cannot read property of undefined in spfx

Hear is a SPFx react webpart ".tsx" file code image Have you any solution ?
2
votes
1answer
208 views

MS Graph API - Problems on SPO Mobile-App

The Background: I am developing Sharepoint Online Webparts on-demand. Sometimes the functionality of these Webparts include the use of Microsoft's "Graph-API" to access Data regarding Office 365 ...
1
vote
1answer
2k views

How to connect react web part to azure sql database? [closed]

Any advice about how to connect a spfx web part using the react template to an azure sql database. But can't seem to find a clear example. I'd be looking to bind controls e.g. Combo boxes to a sql ...