Questions tagged [react]

React is a JavaScript library for building user interfaces. It uses a declarative paradigm and aims to be both efficient and flexible.

98 questions with no upvoted or accepted answers
Filter by
Sorted by
Tagged with
3
votes
0answers
335 views

What are the supported office UI fabric versions for SPFX 1.1.0

There are many threads and answers regarding this question. But i didn't find a satisfying answer. I am currently working on a SPA for SharePoint 2016 OnPrem. I scaffolded my Project with the Yeoman ...
3
votes
0answers
2k views

“Error: Token renewal operation failed due to timeout” in adal.js SharePoint Framework React

I have developed a webpart to get Azure users using SharePoint Framework React with graph api. But in Adal.js file getting following error: Error: Token renewal operation failed due to timeout I ...
2
votes
0answers
42 views

Get Detailed SP List Item Version History

I am using ReactJS to develop a custom form and my list includes a multiple lines of text field with the AppendOnly flag set to true. When I open the form, I want to retrieve the version history for ...
2
votes
0answers
2k views

@types/react and @types/prop-types errors when building with gulp build or gulp serve

For my team's project, some of us are hitting a type issue when building. We're using version 1.7.0 of all the @microsoft/sp- packages. tslint version: 5.9.1 typescript version: 2.4.2 Build tools ...
2
votes
0answers
115 views

I need to get all properties of taxonomy termstrore. which I already get are “Label”,“WSSId”,“TermGuid” but I need to get Other labels as well

Is there any solution to get other properties for taxonomy termstore. As I remember, I usually used "include" to get all properties which I mentioned in JSOM. But now I need to work by using ...
1
vote
1answer
51 views

React SPFX - populate Property Pane Drop down with ID's from SharePoint list

I am new to spfx and struggling with a simple task...!! I have a property pane drop down selecting a SharePoint list which works, now I would like a drop down that is dynamically populated with the ...
1
vote
1answer
21 views

how to render or display data in react useeffect hook

I am able to get data in react JSON object, now I want to convert the JSON to string data and display into the page, Please find the below screenshot. export const QvcPollsTab = () => { ...
1
vote
0answers
102 views

.JS file in SPFX WebPart: Module parse failed: Unexpected token You may need an additional loader to handle the result of these loaders

I have created an SPFx project with reactJS. I am using .jsx extension - functional components. Now, the spfx webpart is already working fine, but I saw a material kit that I want to reuse its ...
1
vote
1answer
118 views

Minimize and open iframe using react js in SPFX

I have a iframe control imported from 'react-iframe'.We are showing a chatbot(PowerVirtualAgent) inside an iframe . I want to have a minimize button and open button functionalities over the iframe ...
1
vote
0answers
41 views

How to set active item index in pnp/spfx carousel?

I am using Pnp/spfx Carousel control and binding elements like below: <Carousel buttonsLocation={CarouselButtonsLocation.center} buttonsDisplay={...
1
vote
3answers
130 views

Expanding People and Groups Column using React SPFx

Being new to SPFx , I've not able to retrieve values from people and group Attendee column Below are the steps I followed Defined Attendee in the below interface export interface IListItem{ ...
1
vote
0answers
20 views

Can I display a webpart as output of another webpart?

Can I output a webpart as part of another webpart rather than duplicating the HTML? For example, if I have a 'Person' webpart that outputs a contact card, can I have a 'People' webpart that outputs a ...
1
vote
0answers
45 views

SharePoint 2019 SPFx, react-router-dom and its types

I am using SharePoint 2019 on premise. When I latest react-router-dom and its type I get error for type. Below is my dependencies and my "typescript": "~2.4.1" So somebody help me which version ...
1
vote
0answers
28 views

SP Online modern ui: reformat date in managed property column

Using SP Online, trying to show a friendly format date (without time) in the SPFx modern search results web part. I've mapped the date column to a preset managed property of type date. That displays ...
1
vote
2answers
675 views

I want to insert attachment in particular list item using pnpjs

I want to update the list item with attachment but not sure why its failing the payload while saving it. try { sp.web.lists.getByTitle(listName).items.select(item.Title).add((r => { // this will ...
1
vote
0answers
129 views

SPFX : TypeError: external__react_.useContext is not a function

I am using office-ui-fabric card in my spfx web part. Getting the error as below. createComponent.tsx:51 Uncaught TypeError: external__react_.useContext is not a function at result (...
1
vote
1answer
159 views

Sharepoint online/365 integration (Upload files) on React app hosted on Azure and WebApi C# .Net Core 2.2

I'm struggling since some weeks ago trying to interact/automate a way to upload files from a Web App created in React and upload files to a Sharepoint Online Site – in a specific folder. The WebApp is ...
1
vote
0answers
426 views

SPFX Add webpart dynamically at runtime

I'm trying to render webparts dynamically at runtime. I have almost no experience with react, so this is where I'm stuck (I think). Using pnp-js I can get the webpart definition and manifest like this:...
1
vote
1answer
977 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 ...
1
vote
0answers
39 views

React button to open SharePoint Document Picker

I have seen and experimented with the Property Pane controls that allow you to select a document or image from a pane and was curious if anyone has seen this same capability available from a button ...
1
vote
1answer
696 views

SPFX - React JS : How to handle an empty list

SPFX-ReactJS newbie here. Wondering how I should handle an empty list. I am trying to connect my web part to a list and simply display them on my web part and automatically update the page as items ...
1
vote
2answers
880 views

spfx webpart/component with position: fixed

I'm trying to create a spfx-react webpart for SharePoint Online like the feedback button on the walmart page (https://www.walmart.com right side). This works in edit mode and in the workbench (local ...
1
vote
0answers
99 views

(Problem)SPFx rendering items from RSS after selecting number of items you want to display with slider

I am currently building an RSS webpart in SPFx using React as a framework. Now I am in the stage that I want the user to be able to select how many news items he/she want to see with a slider (taken ...
1
vote
0answers
353 views

Issue with rendering XML data in SPFx

I am in a project of making a RSS feed in SPFx and using React.js and TypeScript. When I try to retrieve XML data from a news site, the console gives error: Because it complains about CORS, so I ...
1
vote
0answers
81 views

SPFX Webpart with Dropdown don't work on Classic pages

I currently have a spfx web-part which contains a dropdown, when I add it to a classic page and try to use the dropdown when the SharePoint ribbon displays the Format Text tab, the dropdown keeps ...
1
vote
1answer
139 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
1answer
199 views

How can I create webpack package of SharePoint online for react App?

I can create package of react app for SharePoint online by using "gulp serve" and "gulp package-solution" commands. However, I want to create package by using Webpack. How can I achieve this?
1
vote
1answer
228 views

Office UI Fabric Ract Command Giving an error UNMET PEER DEPENDENCY

Issue while adding command "npm --save install office-ui-fabric-react" NPM Version: @microsoft/generator-sharepoint@1.0.2 gulp@3.9.1 yo@2.0.2 How to solve this issue? It gives warning:office-ui-...
1
vote
1answer
1k views

Cascading dropdown list in SPFx web part

Can someone help me with this issue as I would like to create cascading dropdown lists inside the web part itself and not in the property pane. I have found this code in [github react-...
1
vote
1answer
577 views

SPFx get all sites were user has permissions

is there a way to get all site collections and subsites where the current user has access to? I would like to build a web part in SPFx and in React. Any suggestions are welcome. Thank you.
1
vote
0answers
1k views

Using SP-PNP-JS to get data from custom content type fields with React

I'm currently making News Listing Web Part, where News are made as custom content type. I managed to get the basic fields like id, title, but others are really bothering me. The API fetches all the ...
1
vote
1answer
840 views

how to display two sharepoint list data separately in react?

my requirement is i have to display 4 list separately under collapsable panel but the problem is, I am not able to segregate the list , is there any way? help me. export interface IMyWorkListState { ...
1
vote
1answer
359 views

SPFx - How to protect and minify my output bundle.js

When i deploy my solution.sppkg i want to protect my output bundle js to avoid js injection? How to minify bundle.js with gulp task? How to do this?
1
vote
0answers
505 views

Sharepoint 2013 Hosted Add-in using React and React router

I have a reach JS app that uses react router. As a stand alone it works perfectly. I am now trying to use it in a SharePoint hosted app. I created the app using create-react-app from github. When I ...
0
votes
4answers
80 views

SPFX display rich text field in webpart

I am creating an SPFX React project that will display a field from a SharePoint list in a web part A user opens the property pane and: selects a list selects the item ID from that list selects the ...
0
votes
0answers
12 views

slick slider slides are not reducing when we add it in SP Page small section

I am using react slick slider, if i add it in a SP Modern page full section(3 slides) it works perfectly.but if i placed it in the One-third right sections. The same 3 slides appeared with conjusted ...
0
votes
0answers
14 views

How to create a wiki app using react and SPFx steps?

I have to create app wiki in SharePoint using react. It should be displayed in SPFx web part in below format. Provide me any code examples in React JS. I would like to do a autocomplete search to find ...
0
votes
1answer
32 views

SharePoint SPFx webapp on staging site

I created a SharePoint SPFx react webpart that is now deployed on one of my SharePoint sites. I want to continue to make updates to this webpart. I "cloned" my SharePoint site so that it can ...
0
votes
1answer
77 views

Retrieve item ID after adding to SharePoint list using PNPJs

I'm building a SharePoint SPFx react app. In a nutshell, the user fills out a form that I created. When the user hits submit, using PNPJs: https://pnp.github.io/pnpjs/sp/items/ I'm adding the item to ...
0
votes
0answers
32 views

Height issue in React Slick Slider

I am using React slick slider in my spfx react webpart. how to fix this below issue, i want to have same height for all the slides. Added my css and render method below.Any help would be appreciated. ....
0
votes
0answers
28 views

How do I access SharePoint 2019 on-premises list data to Native React mobile app(Not SPFX WebPart)?

I want to access SharePoint 2019 on premises list data and do CRUD operation on it into react native mobile app. How do I do this using REST API(Without sending user name and password - Single sign on ...
0
votes
0answers
15 views

USA Map with Data

I am checking https://www.react-simple-maps.io/examples/usa-with-state-labels/ , was wondering how to implement when a user clicks on a state, some data which is defined should show up. How to get ...
0
votes
0answers
35 views

SharePoint 2019 not getting all recurrence events in calendar

I am getting events with the help of a query and it is working ok. But I only get one item from the recurrence item even though I have <ExpandRecurrence> tag set to true. What am I doing wrong? ...
0
votes
0answers
346 views

Gulp bundle --ship: The build failed because a task wrote output to stderr error

I'm building a SharePoint SPFx and randomly when running gulp bundle --ship I get the following error: The build failed because a task wrote output to stderr. Exiting with exit code: 1 I saw this ...
0
votes
0answers
23 views

Fetching Planner Task through Graph API into webpart

public componentDidMount() { this.props.context.msGraphClientFactory.getClient().then((client: MSGraphClient): void => { client .api('me/planner/tasks') .version("v1.0") ....
0
votes
2answers
42 views

Passing variables in Query string in tsx file (react +typescript)

I am trying to pass plainid and id as a parameter in query string in URL. {planid = item.planId} { id =item.id} <td><a href="https://tasks.office.com/credentinfotech.com/en-GB/...
0
votes
0answers
10 views

Add query string to url so that it can show the planner task pop up form

we have created webpart in sharepoint SPFX with react framework and fetch data using graph API From this webpart we want to redirect to planner task's popform This is the Planner Task PopUp form I ...
0
votes
1answer
38 views

Programatically add “Web part gallery” in a custom web part in SharePoint Online

I have a custom web part that have different tabs. In two of the tabs/pivots I want the user to be able to add a web part from the web part gallery and to do so I need either to programatically add ...
0
votes
0answers
27 views

Runtime error in SPFx React app when using react-datepicker

I'm having problem when including react-datepicker to my solution. It's very simple SPFx React project. I'd be glad to get any help with this. I'm pretty new to SPFx and React. The error shows as soon ...
0
votes
0answers
12 views

Component Inheritance from Property Pane

I want to know if it is possible for other react components created within the spfx project to inherit property pane properties from the root class and if yes how does one go about it???