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

Is there any way to comment in tsx typescript codes without curly braces?

When I comment something in my react tsx file, it usually wrapped between { } automatically, even if it is in single line, and it may be mixed up by other parts of codes. Is there any way to comment in tsx typescript codes without curly braces?
user17060738
0
votes
1 answer

Declare arguments with interface on typescript react hook

I am trying to create a custom hook that receives 2 typed arguments with an interface but I am getting a message Expected 1 arguments, but got 2, I am not sure if I am declaring the interface wrong or if the file can't be tsx File index.tsx const…
LuisEnMarroquin
  • 1,609
  • 1
  • 14
  • 26
0
votes
1 answer

Typescript overloads with generics, type inference and React Components

Apologies for the rubbish question name. Here are the details. I have a HoC/Mixin function export function MyMixin(WrappedComponent: React.ComponentClass): React.ComponentClass { return…
Dave
  • 2,829
  • 3
  • 17
  • 44
0
votes
1 answer

I want to add a loading spinner or add some dialog until highcharts get loaded and should close after chart is loaded in react typescript?

I got many angular examples but not a single example that shows loader while highcharts are loading (bcoz of huge data) in react typescript . I have even tried function like events.redraw and events.render but no luck.
0
votes
1 answer

What should be the type of a RouteComponentProps to add additional attributes under props parameter?

I have the following component using react-router-dom: ( )} /> Now, in my Restaurant.tsx code, I can't seem to figure out what should be the proper type for…
Loqz
  • 373
  • 4
  • 16
0
votes
1 answer

How to pass props or state or even parameter to a component in typescript react

Super noob here... So, I have this school project, and things are getting a bit hard... I'm trying to pass some props from one component to another and I have no idea why it always fail. So, the idea is that when someone select an option from one…
0
votes
2 answers

NextJs: cannot execute function imported from .ts file inside TSX, throws ModuleNotFound error

I have an issue which is likely related to using NextJs with typescript. Example: // /pages/index.tsx import _ from 'lodash' export const MyComponent = () => { return {
    { _.map(someArray, el =>
  • {el}
  • ) // Error: Module not…
0
votes
2 answers

extracting an object from a array of objects in typescript

I have a array of objects of interface Subjects. I want only a single object from that array and pass it as a prop to a component to render that data. "I am new To Typescript". export interface Subjects { id: number; subject: string; …
NWOS
  • 3
  • 2
0
votes
2 answers

Why does this "cannot update unmounted component" fix work?

I kept getting the Warning: Can't perform a React state update on an unmounted component message on a number of pages I was working on that are written using TypeScript with React. I'd seen a number of forums offering a solution that includes…
0
votes
0 answers

Separate values in select dropdown from a JSON array in React

I've created a select dropdown from a JSON file. The key I'm reading is an array : "type": [ "Grass", "Poison" ] When the array have just one value, it works fine but when it has two like here, I have this result This where I created my…
Random Dev
  • 47
  • 4
0
votes
1 answer

make follow and unfollow button in react(changing button)

This is my code, I used Map to render the vacations cards and I need to add follow and unfollow functionality. I want it to change after I press on "Follow" change it to "Unfollow" on one card only. if anyone can help me it would be much…
0
votes
1 answer

React mobx cannot find the injected store

I bind a click event to the checkbox, which will call the action function in the store. However, when I click the checkbox, the store doesn't seem to be injected. I bind the click event on checkbox. The CheckBox.tsx: import * as React from…
0
votes
1 answer

How can I pass values from component from A to B component in react?

Parent component export interface IInvoiceDetailProps extends StateProps, DispatchProps, RouteComponentProps<{ id: string }> { } export const InvoiceDetail = (props: IInvoiceDetailProps) => { useEffect(() => { …
Dhaval
  • 1
0
votes
0 answers

Type 'Map | undefined' is not assignable to type '{ [key: string]: Pod[]; }'

I have been trying to use a map to store the responses of proxies from two different providers to make it easier to look them up as they would be stored in a hash-map. For example: let proxies = new Map
user16522090
0
votes
2 answers

define object type with dynamic number of key and value and also that values can have string or number value

i have a project with nextjs and typescript.i have a function with name of submit func. this function accept three argument.type with string type base end point with string type and my problem is whit third argument and i can't handle type for this…
Ali Ehyaie
  • 1,116
  • 3
  • 13
  • 27