Giter Site home page Giter Site logo

Comments (9)

ferdaber avatar ferdaber commented on March 28, 2024 1

Sorry I made a typo, it's JSX.LibraryManagedAttributes, it is not under the React namespace.

from react.

karfau avatar karfau commented on March 28, 2024 1

This was very helpful.
Who thinks it is worth adding it to the defaultProps section?

from react.

swyxio avatar swyxio commented on March 28, 2024 1

PR welcome @karfau

from react.

ferdaber avatar ferdaber commented on March 28, 2024

@w1301625107 you need to set AProps to not have an optional value property. AProps is intended to be the props that the component sees inside itself (after defaultProps takes into effect). TypeScript will then work out what is allowed and not allowed to be in the JSX attributes after combining AProps and defaultProps.

from react.

w1301625107 avatar w1301625107 commented on March 28, 2024

@w1301625107 you need to set AProps to not have an optional value property. AProps is intended to be the props that the component sees inside itself (after defaultProps takes into effect). TypeScript will then work out what is allowed and not allowed to be in the JSX attributes after combining AProps and defaultProps.

谢谢。但是这样怎么让人知道A 是可选的参数呢
Thank you. But how does this make people know that A is an optional parameter?

from react.

ferdaber avatar ferdaber commented on March 28, 2024

It doesn't. Your AProps interface is not your external contract for your component, it is the internal contract (what your component implements). If you want to create a type for your external contract (what consumers of your component expect) without rewriting I would do this:

// internal contract, should not be exported out
type AProps = {
  value?: number
}

class A extends Component<AProps> {
  static defaultProps = { value: 0 }
}

// external contract
export type ApparentAProps = JSX.LibraryManagedAttributes<typeof A, AProps>

from react.

w1301625107 avatar w1301625107 commented on March 28, 2024

It doesn't. Your AProps interface is not your external contract for your component, it is the internal contract (what your component implements). If you want to create a type for your external contract (what consumers of your component expect) without rewriting I would do this:

// internal contract, should not be exported out
type AProps = {
  value?: number
}

class A extends Component<AProps> {
  static defaultProps = { value: 0 }
}

// external contract
export type ApparentAProps = JSX.ManagedAttributes<typeof A, AProps>

i got an error,how to fix it? @types/react
image

image

from react.

w1301625107 avatar w1301625107 commented on March 28, 2024

If I want to rewrite it, what is the step?

from react.

stale avatar stale commented on March 28, 2024

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions!

from react.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.