1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
|
=== tests/cases/conformance/jsx/file.tsx ===
import React = require('react');
>React : typeof React
interface Props {
a: number;
>a : number
b: number;
>b : number
c?: number;
>c : number | undefined
d?: number;
>d : number | undefined
}
const props: Props = { a: 1, b: 1 };
>props : Props
>{ a: 1, b: 1 } : { a: number; b: number; }
>a : number
>1 : 1
>b : number
>1 : 1
const Foo = (props: Props) => <div>{ props.a }</div>;
>Foo : (props: Props) => JSX.Element
>(props: Props) => <div>{ props.a }</div> : (props: Props) => JSX.Element
>props : Props
><div>{ props.a }</div> : JSX.Element
>div : any
>props.a : number
>props : Props
>a : number
>div : any
// ok
const a1 = <Foo {...props}></Foo>;
>a1 : JSX.Element
><Foo {...props}></Foo> : JSX.Element
>Foo : (props: Props) => JSX.Element
>props : Props
>Foo : (props: Props) => JSX.Element
const a2 = <Foo d={1} {...props}></Foo>;
>a2 : JSX.Element
><Foo d={1} {...props}></Foo> : JSX.Element
>Foo : (props: Props) => JSX.Element
>d : number
>1 : 1
>props : Props
>Foo : (props: Props) => JSX.Element
// error
const b1 = <Foo a={1} {...props}></Foo>;
>b1 : JSX.Element
><Foo a={1} {...props}></Foo> : JSX.Element
>Foo : (props: Props) => JSX.Element
>a : number
>1 : 1
>props : Props
>Foo : (props: Props) => JSX.Element
const b2 = <Foo a={1} b={2} {...props}></Foo>;
>b2 : JSX.Element
><Foo a={1} b={2} {...props}></Foo> : JSX.Element
>Foo : (props: Props) => JSX.Element
>a : number
>1 : 1
>b : number
>2 : 2
>props : Props
>Foo : (props: Props) => JSX.Element
const b3 = <Foo a={1} d={1} {...props} {...{ d: 1 }}></Foo>;
>b3 : JSX.Element
><Foo a={1} d={1} {...props} {...{ d: 1 }}></Foo> : JSX.Element
>Foo : (props: Props) => JSX.Element
>a : number
>1 : 1
>d : number
>1 : 1
>props : Props
>{ d: 1 } : { d: number; }
>d : number
>1 : 1
>Foo : (props: Props) => JSX.Element
const b4 = <Foo a={1} d={1} {...props} {...{ a: 1, d: 1 }}></Foo>;
>b4 : JSX.Element
><Foo a={1} d={1} {...props} {...{ a: 1, d: 1 }}></Foo> : JSX.Element
>Foo : (props: Props) => JSX.Element
>a : number
>1 : 1
>d : number
>1 : 1
>props : Props
>{ a: 1, d: 1 } : { a: number; d: number; }
>a : number
>1 : 1
>d : number
>1 : 1
>Foo : (props: Props) => JSX.Element
|
