Stack Overflow
Stack Overflow

Questions tagged [tsx]

Extension for TypeScript files using JSX syntax

TypeScript supports embedding, type checking, and compiling JSX directly to JavaScript, as long as:

  1. Files are named with a .tsx extension
  2. The jsx compiler option is enabled

Documentation: JSX

This tag used to be about Intel's transactional memory. Use for that. See Wrong usage of the [tsx] tag on meta.

674 questions
-1
votes
1 answer

How to properly use satisfies

I'm building a custom React hook using latest TypeScript. I have issues understanding how to properly use satisfies operator. The reason why I want to use it is because I'm unable to pass conditional values. My Hook: import { useQuery } from…
Alex
  • 1,210
  • 3
  • 21
  • 34
-1
votes
1 answer

How can I use a single tsx file in my react application?

I import MultiRangeSlider in react which asks for a "ChangeResult" module which only works with tsx but all other files are in jsx. I would like to avoid modifying all my application. See line 27 import MultiRangeSlider, { ChangeResult } from…
David Arboin
  • 1
  • 1
-1
votes
1 answer

How to import image in .tsx with react?

I have problem with image importing in typescript. Previously I used the img src="" but it says View config getter callback for component img must be a function (received undefined). Make sure to start component names with a capital letter. But…
andi azamuddin
  • 23
  • 5
-1
votes
1 answer

Error - JSX Element type 'X'does not have any constructor or call signatures

I am trying to render a data by context provider however i got this message reading JSX Element type Context does not have any constructor or call signatures. My Code in App.tsx is import { Context } from './interfaces/cardContext'; const App = ()…
Jovan Tanchevski
  • 3
  • 3
-1
votes
1 answer

how to invoke wrapper with children component in react?

My children component is: interface AuthContextType { user: any; signin: (user: string, callback: VoidFunction) => void; signout: (callback: VoidFunction) => void; } let AuthContext = React.createContext(null!); interface…
user504909
  • 9,119
  • 12
  • 60
  • 109
-1
votes
2 answers

How do you set the state of a component pre render?

I am passing props to a react component using TSX and want to set the state of the component to be the values of the props, however it is not setting the state. I printed to the console the values of props and state. Props returns the array of…
dwewers
  • 67
  • 6
-1
votes
1 answer

cannot render any of my code to my react-appliaction

I am making a Typescript and React app. I am using 4 main files, App.tsx, Header.tsx, Ap.css. I think the real problem is the way I am trying to use the add the Header.tsx file to App.tsx. Please help App.tsx: import React from "react"; import…
xpress
  • 90
  • 1
  • 6
-1
votes
1 answer

NextJS Image url not changing in different endpoints

So currently I have an issue where I have a Channel Tab where it displays the channel icon and name. Now the problem is, every time I change channels the icon stays the same as the first channel I clicked. PREVIEW This is my current code:…
Jaden derulo
  • 145
  • 4
  • 13
-1
votes
1 answer

React - Set state work only in async operation

I'm using React (with TypeScript), and I found out very strange behavior. In the method "handleAnswer" I'm changing the variable "isReady" and also printing the value using the useEffect hook. but the change only takes place if I put a timer there,…
dev3dev
  • 128
  • 1
  • 1
  • 9
-1
votes
1 answer

How to add a string in an array which is in an object which is in a state array

Now siizeVariant is a string Array and I want to add Strings to it with an onClick event. findIndex works fine. It's just the concat section. I guess it's wrong to use it there but I have no idea what to do else :/ const [selectedP, setSelectedP] =…
cocoscocos
  • 1
  • 1
-1
votes
1 answer

React typescript recognizes array as object

new to react and js in general so it might be a dumb question but I can't sort it out. I have a component like so: export interface TableViewContainerProps { header: WorthSummaryContainerProps content: TableViewRowProps[] } export const…
user11910733
-1
votes
1 answer

TSX CSS conditional rendering always giving true statment

enter image description here transform: aboutMe => (aboutMe ? "translateY(-500%)" : "translateY(0%)") So I used to run my React project and use MaterialUi's MakeStyles to include the CSS in the same tsx file and benefit from the JavaScript code to…
MrAhmed
  • 3
  • 3
-1
votes
2 answers

Does React use Redux or Flux by default?

When I create a new react app with npx create-react-app my-app --template typescript what kind of software architecture does it have by default (MVC, Redux or Flux)? I read all the differences and I got confused a little bit, so I would like to know…
Georgi Yakov
  • 53
  • 3
  • 11
-1
votes
1 answer

React.createElement: type is invalid - Electron-React-Boilerplate

I'm a designer who's trying to pick up some coding so I can work on my own projects in my free time. I cloned this [electron-react-boilerplate][1] to get started and am starting with the navigation UI just to get the ball rolling. Error Warning:…
Blksheep93
  • 47
  • 1
  • 5
-1
votes
2 answers

useState on startDate not updating the date when I use setStartDate

here is my codes import format from "date-fns/format"; import setHours from "date-fns/setHours"; import setMinutes from "date-fns/setMinutes"; const [startDate, setStartDate] = useState(new Date()); const startTime =…
Zee
  • 351
  • 1
  • 15
1 2 3
…
44
45