You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: docs/framework/angular/guides/basic-concepts.md
+34-4Lines changed: 34 additions & 4 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -40,21 +40,51 @@ Each field has its own state, which includes its current value, validation statu
40
40
41
41
Example:
42
42
43
-
```tsx
43
+
```ts
44
44
const {
45
45
value,
46
46
meta: { errors, isValidating },
47
47
} =field.state
48
48
```
49
49
50
-
There are three field states can be very useful to see how the user interacts with a field. A field is _"touched"_ when the user clicks/tabs into it, _"pristine"_ until the user changes value in it, and _"dirty"_ after the value has been changed. You can check these states via the `isTouched`, `isPristine` and `isDirty` flags, as seen below.
50
+
There are four states in the metadata that can be useful to see how the user interacts with a field:
Copy file name to clipboardExpand all lines: docs/framework/lit/guides/basic-concepts.md
+34-4Lines changed: 34 additions & 4 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -86,17 +86,47 @@ For Example:
86
86
87
87
Each field has its own state, which includes its current value, validation status, error messages, and other metadata. You can access a field's state using its `field.state` property.
88
88
89
-
```tsx
89
+
```ts
90
90
const {
91
91
value,
92
92
meta: { errors, isValidating },
93
93
} =field.state
94
94
```
95
95
96
-
There are three field states can be very useful to see how the user interacts with a field. A field is _"touched"_ when the user clicks/tabs into it, _"pristine"_ until the user changes value in it, and _"dirty"_ after the value has been changed. You can check these states via the `isTouched`, `isPristine` and `isDirty` flags, as seen below.
96
+
There are four states in the metadata that can be useful to see how the user interacts with a field:
-**Behavior**: A field remains 'dirty' once changed, even if reverted to the default value.
118
119
119
-
We have chosen the persistent 'dirty' state model. To also support a non-persistent 'dirty' state, we introduce the isDefault flag. This flag acts as an inverse of the non-persistent 'dirty' state.
120
+
We have chosen the persistent 'dirty' state model. To also support a non-persistent 'dirty' state, we introduce an additional flag:
Copy file name to clipboardExpand all lines: docs/framework/solid/guides/basic-concepts.md
+34-4Lines changed: 34 additions & 4 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -77,21 +77,51 @@ Each field has its own state, which includes its current value, validation statu
77
77
78
78
Example:
79
79
80
-
```tsx
80
+
```ts
81
81
const {
82
82
value,
83
83
meta: { errors, isValidating },
84
84
} =field().state
85
85
```
86
86
87
-
There are three field states can be very useful to see how the user interacts with a field. A field is _"touched"_ when the user clicks/tabs into it, _"pristine"_ until the user changes value in it, and _"dirty"_ after the value has been changed. You can check these states via the `isTouched`, `isPristine` and `isDirty` flags, as seen below.
87
+
There are four states in the metadata that can be useful to see how the user interacts with a field:
Copy file name to clipboardExpand all lines: docs/framework/svelte/guides/basic-concepts.md
+32-2Lines changed: 32 additions & 2 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -83,14 +83,44 @@ const {
83
83
} =field.state
84
84
```
85
85
86
-
There are three field states can be very useful to see how the user interacts with a field. A field is _"touched"_ when the user clicks/tabs into it, _"pristine"_ until the user changes value in it, and _"dirty"_ after the value has been changed. You can check these states via the `isTouched`, `isPristine` and `isDirty` flags, as seen below.
86
+
There are four states in the metadata that can be useful to see how the user interacts with a field:
87
+
88
+
-_"isTouched"_, after the user changes the field or blurs the field
89
+
-_"isDirty"_, after the field's value has been changed, even if it's been reverted to the default. Opposite of `isPristine`
90
+
-_"isPristine"_, until the user changes the field value. Opposite of `isDirty`
Copy file name to clipboardExpand all lines: docs/framework/vue/guides/basic-concepts.md
+35-5Lines changed: 35 additions & 5 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -76,25 +76,55 @@ Example:
76
76
77
77
## Field State
78
78
79
-
Each field has its own state, which includes its current value, validation status, error messages, and other metadata. You can access a field's state using the `field.state` property.
79
+
Each field has its own state, which includes its current value, validation status, error messages, and other metadata. You can access a field's state using the `field().state` property.
80
80
81
81
Example:
82
82
83
-
```js
83
+
```ts
84
84
const {
85
85
value,
86
86
meta: { errors, isValidating },
87
87
} =field.state
88
88
```
89
89
90
-
There are three field states can be very useful to see how the user interacts with a field. A field is _"touched"_ when the user clicks/tabs into it, _"pristine"_ until the user changes value in it, and _"dirty"_ after the value has been changed. You can check these states via the `isTouched`, `isPristine` and `isDirty` flags, as seen below.
90
+
There are four states in the metadata that can be useful to see how the user interacts with a field:
// The following line will re-create the non-Persistent `dirty` functionality.
123
+
const nonPersistentIsDirty =!isDefaultValue
124
+
```
125
+
126
+
127
+
98
128
## Field API
99
129
100
130
The Field API is an object provided by a scoped slot using the `v-slot` directive. This slot receives an argument named `field` that provides methods and properties for working with the field's state.
0 commit comments