File tree Expand file tree Collapse file tree 1 file changed +44
-0
lines changed Expand file tree Collapse file tree 1 file changed +44
-0
lines changed Original file line number Diff line number Diff line change @@ -90,9 +90,53 @@ Js.log(studentName)
90
90
import Student from " ./student" ;
91
91
var studentName = Student;
92
92
```
93
+
94
+ </CodeTab >
95
+
96
+ ### Import a React Component
93
97
98
+ <CodeTab labels = { [" ReScript" , " JS Output (ES6)" ]} >
99
+
100
+ ``` res example
101
+ module DatePicker = {
102
+ @react.component @module("react-datepicker")
103
+ external make: (~date: Js.Date.t, ~onChange: (Js.Date.t) => unit) => React.element = "default"
104
+ }
105
+
106
+ @react.component
107
+ let make = () => {
108
+ let (date, setDate) = React.useState(Js.Date.make)
109
+ <DatePicker date=date onChange={date => setDate(_ => date)} />
110
+ }
111
+ ```
112
+ ``` js
113
+ import * as Curry from " ./stdlib/curry.js" ;
114
+ import * as React from " react" ;
115
+ import ReactDatepicker from " react-datepicker" ;
116
+
117
+ var DatePicker = {};
118
+
119
+ function Playground (Props ) {
120
+ var match = React .useState (function () {
121
+ return new Date ();
122
+ });
123
+ var setDate = match[1 ];
124
+ return React .createElement (ReactDatepicker, {
125
+ date: match[0 ],
126
+ onChange: (function (date ) {
127
+ return Curry ._1 (setDate, (function (param ) {
128
+ return date;
129
+ }));
130
+ })
131
+ });
132
+ }
133
+ ```
134
+
94
135
</CodeTab >
95
136
137
+
138
+ For more information, see [ the React documentation] ( ../../react/latest/introduction.md ) .
139
+
96
140
## Export To JavaScript
97
141
98
142
### Export a Named Value
You can’t perform that action at this time.
0 commit comments