@@ -6,32 +6,30 @@ import 'dart:html';
6
6
import 'package:react/react.dart' as react;
7
7
import 'package:react/react_dom.dart' as react_dom;
8
8
9
- /**
10
- * Hello,
11
- *
12
- * This is the Dart portion of the tutorial for the Dart react package.
13
- *
14
- * We'll go through a simple app that queries the Google Maps API and shows the result to the user.
15
- * It also stores the search history and allows the user to reload past queries.
16
- *
17
- * In this file you'll find the structure and the logic of the app. There is also a `geocodes.html` file which contains
18
- * the mount point.
19
- *
20
- * Be sure that you understand the basic concepts of [React] (http://facebook.github.io/react/) before reading this
21
- * tutorial.
22
- *
23
- * Enjoy!
24
- */
9
+ /// Hello,
10
+ ///
11
+ /// This is the Dart portion of the tutorial for the Dart react package.
12
+ ///
13
+ /// We'll go through a simple app that queries the Google Maps API and shows the result to the user.
14
+ /// It also stores the search history and allows the user to reload past queries.
15
+ ///
16
+ /// In this file you'll find the structure and the logic of the app. There is also a `geocodes.html` file which contains
17
+ /// the mount point.
18
+ ///
19
+ /// Be sure that you understand the basic concepts of [React] (https://reactjs.org/) before reading this
20
+ /// tutorial.
21
+ ///
22
+ /// Enjoy!
25
23
26
24
/// Divide your app into components and conquer!
27
25
///
28
- /// This is the first custom [ Component] .
26
+ /// This is the first custom ` Component` .
29
27
///
30
28
/// It is just an HTML `<tr>` element displaying a single API response to the user.
31
29
class _GeocodesResultItem extends react.Component {
32
30
/// The only function you must implement in the custom component is [render] .
33
31
///
34
- /// Every [ Component] has a map of properties called [Component. props] . It can be specified during creation.
32
+ /// Every ` Component` has a map of properties called ` props` . It can be specified during creation.
35
33
@override
36
34
render () {
37
35
return react.tr ({}, [
@@ -42,12 +40,12 @@ class _GeocodesResultItem extends react.Component {
42
40
}
43
41
}
44
42
45
- /// Now we need to tell ReactJS that our custom [ Component] exists by calling [ registerComponent] .
43
+ /// Now we need to tell ReactJS that our custom ` Component` exists by calling ` registerComponent` .
46
44
///
47
45
/// As a reward, it gives us a function, that takes the properties and returns our element. You'll see it in action
48
46
/// shortly.
49
47
///
50
- /// This is the only correct way to create a [ Component] . Do not use the constructor!
48
+ /// This is the only correct way to create a ` Component` . Do not use the constructor!
51
49
var geocodesResultItem = react.registerComponent (() => _GeocodesResultItem ());
52
50
53
51
/// In this component we'll build an HTML `<table>` element full of the `<tr>` elements generated by
@@ -97,11 +95,11 @@ class _GeocodesResultList extends react.Component {
97
95
98
96
var geocodesResultList = react.registerComponent (() => _GeocodesResultList ());
99
97
100
- /// In this [ Component] we'll build a search form.
98
+ /// In this ` Component` we'll build a search form.
101
99
///
102
- /// This [ Component] illustrates that:
100
+ /// This ` Component` illustrates that:
103
101
///
104
- /// > The functions can be [ Component] parameters _(handy for callbacks)_
102
+ /// > The functions can be ` Component` parameters _(handy for callbacks)_
105
103
///
106
104
/// > The DOM [Element] s can be accessed using `ref` s.
107
105
class _GeocodesForm extends react.Component {
@@ -216,9 +214,9 @@ class _GeocodesHistoryList extends react.Component {
216
214
217
215
var geocodesHistoryList = react.registerComponent (() => _GeocodesHistoryList ());
218
216
219
- /// The root [ Component] of our application.
217
+ /// The root ` Component` of our application.
220
218
///
221
- /// Introduces [state] . Both [state] and [props] are valid locations to store [ Component] data.
219
+ /// Introduces [state] . Both [state] and [props] are valid locations to store ` Component` data.
222
220
///
223
221
/// However, there are some key differences to note:
224
222
///
@@ -228,7 +226,7 @@ var geocodesHistoryList = react.registerComponent(() => _GeocodesHistoryList());
228
226
///
229
227
/// > When [state] is changed, the component will re-render.
230
228
///
231
- /// It's a common practice to store the application data in the [state] of the root [ Component] . It will re-render
229
+ /// It's a common practice to store the application data in the [state] of the root ` Component` . It will re-render
232
230
/// every time the state is changed. However, it is not required - you can also use normal variables and re-render
233
231
/// manually if you wish.
234
232
///
0 commit comments