Stack Overflow
Stack Overflow

Questions tagged [react-tsx]

A TypeScript XML syntax transform recommended for use with React.

TSX is an embeddable XML-like syntax. It is meant to be transformed into valid JavaScript, though the semantics of that transformation are implementation-specific. TSX rose to popularity with the React framework, but has since seen other implementations as well. TypeScript supports embedding, type checking, and compiling TSX directly to JavaScript.

563 questions
0
votes
1 answer

Code works in local dev and not in stackblitz and sandbox

Goal: Display the content of the code in relation to {isAuthenticated ? authenticatedRoutes : nonAuthenticatedRoutes} Problem: When I use codesandbox or Stackblitz it wont display the content. However, when I use my local…
HelloWorld1
  • 13,688
  • 28
  • 82
  • 145
0
votes
0 answers

How to run local JS script in ReactTS?

I'm new to ReactTS. Now I need to insert a web page written in native JS and HTML into a react project. The code is as follows: export default class OpenDrive extends React.PureComponent { override componentDidMount() { const src1 =…
Azphire
  • 93
  • 1
  • 1
  • 7
0
votes
1 answer

Adding path to an image in CSS module from public folder in react

I am trying to add an image as background, however the location of image is in a pulic folder. -public -images -image.png -src -assets -components -index.tsx -index.module.css (I want to use the image.png in this file) If I put the image in…
Sakaggi
  • 93
  • 9
0
votes
2 answers

Styled component react checkbox doesn't appears

Hello i have a problem with my style , checkbox does'nt appears even with a classical input i tried lot of things but bug continue . i use styled-component, react-hook-form, typescript. //import tools import React, { FunctionComponent, useState }…
Vincent Lebrun
  • 11
  • 1
0
votes
1 answer

React component switch animation with a loader - Glitchy

I have a requirement where i have couple of components out of which only one could be displayed at a particular point of time. The components are of varying heights. When a user clicks on the button in the currently displayed component i need…
Vikhyath Maiya
  • 3,122
  • 3
  • 34
  • 68
0
votes
1 answer

React TS Hook code cannot display correctly

Goal: Display data and its content from Test1.tsx Problem: When I apply the code " " at index.tsx, it mention about "Element type is invalid: expected a string (for built-in components) or a class/function (for composite…
HelloWorld1
  • 13,688
  • 28
  • 82
  • 145
0
votes
1 answer

Function with argument won't display in VS Code

Goal: Enable to use function Test2 with argument value "Test 2" and then to be displayed without any error in Visual Studio Code. Problem: When I apply the code "" and "function Test2", it shows an error saying Compiled…
HelloWorld1
  • 13,688
  • 28
  • 82
  • 145
0
votes
1 answer

Function with argument won't display

Goal: Enable to use function Test2 with argument value "Test 2" and then to be displayed without any error. Problem: When I apply the code "", it shows an error saying "Objects are not valid as a React child (found:…
HelloWorld1
  • 13,688
  • 28
  • 82
  • 145
0
votes
2 answers

Apply Generec Typescript for retrieving data by using api link and interface as parameter

Goal: For React TS. The page List1 and List2 should use the same method named useFetch (retrieve data by using api link) by using generic approach by sending the interface (named Client and TheComputer) to the useFetch. Each interface has different…
HelloWorld1
  • 13,688
  • 28
  • 82
  • 145
0
votes
1 answer

MUI DarkTheme not working in DateRangePicker and datetime-local TextField

I encounter some problems with DatePicker and MUI dark mode whereas everyhting works well everywhere else. 1. For TextField with type="datetime-local" I cannot find how to have a white color for the icon
Gaboflo
  • 75
  • 2
  • 7
0
votes
3 answers

reactstrap, dropdown with search input

In order to benefit the design of reactstrap dropdown, I want to use it as a search bar with results shown in the dropdown menu. But the default key listener that enables navigating through results by keyboard (arrow keys Up/Down), only captured by…
Amir-Mousavi
  • 4,273
  • 12
  • 70
  • 123
0
votes
2 answers

I can't call form.validateFields() with form.list - Ant Design

I want to call form.validateFields to validate when form.list remove But i can't {(fields, { add, remove }, { errors }) => ( <> {fields.map(({ key, name, fieldKey, ...restField })…
Boss
  • 1
  • 2
0
votes
0 answers

Global helper function in ReactTS

In ReactTS 16.9, I have the following the function that returns parameter name only if the generic type TObject has the parameter name as key. If the key does not exist, a compile error will be raised. I always import the object first in my…
user3601578
  • 1,310
  • 1
  • 18
  • 29
0
votes
2 answers

ReactNative FlatList not rendering

I am new to ReactNative programming and .tsx files in general. I'm trying to display a basic FlatList and have copied the below code from the ReactNative docs here: (https://reactnative.dev/docs/flatlist). It's only slightly modified to fit into my…
ajavad
  • 105
  • 11
0
votes
0 answers

When should redux store should be updated during async call?

I am new to React and working on a drag and drop feature and in that I have to send a api request to backend on the drag end and also I need to update the state. To achieve this I am using redux-toolkit createAsyncThunk. On drag end action is…
Shail
  • 83
  • 3
  • 11
1 2 3
…
37 38