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
1
vote
1 answer

React UseEffect dependent on context does not update component immediately

I have a list of checkboxes where each is an individual functional component. There is a reset button which is expected to set all checkboxes to be unchecked. I am using context to store checked data values. I am using the following logic to update…
Helen
  • 11
  • 1
1
vote
0 answers

Get input values from children in react

I'm trying to get the text value of the inputs that I pass as children. It's my first attempt to create my very own node module. App.tsx (Client): import React from 'react'; import { TextField, Button } from '@mui/material'; import {MyForm} from…
Markus Profanter
  • 11
  • 2
1
vote
0 answers

Custom typeguard with three diferent interfaces that share the same property

I have three different interfaces which share the same property and want to create a custom typeguard that will check which of interfaces value from [ value, setValue ] = useState({}) has, and depending on it, run adequate setValue(...value,…
Jueltrae
  • 43
  • 1
  • 8
1
vote
1 answer

Either type containing different types

[Original post edited to simplified example] I want to create a component that will take one pair of values (both values based on the same type -> value, setValue), and, based on it, will run functions depending on those types. To fully illustrate…
Jueltrae
  • 43
  • 1
  • 8
1
vote
1 answer

TypeError: (...).map is not a function

I'm new to both javascript and react so there may be many things wrong here. I have an interface LiquidityPosition that I'm trying to display as components through my LiquidityList component. I pass LiquidityList an array of type…
facetiousfactorial
  • 33
  • 3
1
vote
1 answer

'Is not assignable' Type error using generic for sorting

Duplicated here: https://codesandbox.io/s/distracted-sea-uu3l8?file=/src/BoxBox.tsx I've stripped this down and I think the error is close to what I'm getting with the full blown code. I'm using the mui sort example but I'm getting an error when the…
Aaron
  • 13
  • 5
1
vote
2 answers

NPM: How do I troubleshoot if a file inside of a package cannot be found?

How do I troubleshoot if a file inside of a package cannot be found? ./node_modules/react-pdf-highlighter/node_modules/pdfjs-dist/web/pdf_viewer.css Error: Module not found: Can't resolve 'images/loading-icon.gif' I am trying to use the…
Atonic
  • 509
  • 1
  • 5
  • 14
1
vote
1 answer

How to add Tradingview's Lightweight-charts to React Typescript

I tried installing Tradingview's 'lightweight-charts' for react typescript but I can't seem to download the @types for this package because it does not show up on package.json. Therefore, unable to render my react app. I have tried installing with…
tomi lui
  • 19
  • 9
1
vote
1 answer

Why is my react.memo not working? How to properly memoize a child's child?

According to my understanding, when CIsTrue state is updated, the ToolbarButton with "SecondButton" should not re-render. However, when I checked console logs, it does re-render. What am I missing? Does it have something to do with the Icon prop…
Anavi Lohia
  • 31
  • 1
  • 3
1
vote
1 answer

Cannot find module '../Theme/Icons/' or its corresponding type declarations.ts(2307)

I have a new project in React-typescript, where I'm given a repo. The folder structure is as follows: parentDirectory └───src │ │ Components │ │ Store │ │ Theme | │ Icons │ │ Styles I have some svg and png…
Amruta
  • 1,295
  • 1
  • 13
  • 24
1
vote
2 answers

Add item at the bottom of a drawer component

How would I place an entry of a drawer component at the bottom? (instead of consecutively from the top) For example, I want the help item to be at the bottom of the drawer navigation. Here is the code I have so far
vicki
  • 225
  • 2
  • 10
1
vote
3 answers

NextJS Typescript - Object is possibly undefined after guard?

Okay, I'm stumped here. I have a simple React component (just starting out). I need to fetch the data so I'm waiting on some async data. This is my solution as it stands now: import { Component } from "react"; import { Bible } from…
Jim Hessin
  • 137
  • 2
  • 11
1
vote
0 answers

Webpack creates empty image files with FileLoader

I've just created a template for a webapp using Webpack. Unfortunatly whenever I'm building the App to dev or Prod, the File-Loader does not fix there references images and it creates empty files. My config looks like this: webpack.common.config //…
Stephan Pich
  • 171
  • 1
  • 2
  • 11
1
vote
2 answers

Submitting a form in React typescript

I am trying to submit a form to my local database but I keep receiving an error message: :Error: Objects are not valid as a React child (found: Error: Network Error). If you meant to render a collection of children, use an array instead Could…
Z_Cason
  • 25
  • 5
1
vote
0 answers

Maintain generated data from parent component to child components in tabs

I have a component that renders 4 navigation tabs. There is a color filter that filters what colors are presented in the tabs. (held as a list of strings) However, currently when I switch from tab to tab the filters default back to empty. For…
vicki
  • 225
  • 2
  • 10
1 2 3
…
37 38