Skip to content

Commit

Permalink
Update two-way computed property form example (#645)
Browse files Browse the repository at this point in the history
* Update two-way computed property form example

Added a template example to demonstrate two-way computed bound on the input using v-model.

* update for all lang
  • Loading branch information
jblotus authored and ktsn committed Feb 22, 2017
1 parent 5ea4309 commit ca965cd
Show file tree
Hide file tree
Showing 6 changed files with 18 additions and 2 deletions.
3 changes: 3 additions & 0 deletions docs/en/forms.md
Original file line number Diff line number Diff line change
Expand Up @@ -42,6 +42,9 @@ mutations: {

Admittedly, the above is quite a bit more verbose than `v-model` + local state, and we lose some of the useful features from `v-model` as well. An alternative approach is using a two-way computed property with a setter:

``` html
<input v-model="message">
```
``` js
// ...
computed: {
Expand Down
3 changes: 3 additions & 0 deletions docs/fr/forms.md
Original file line number Diff line number Diff line change
Expand Up @@ -42,6 +42,9 @@ mutations: {

Admettons tout de même que l'exemple ci-dessus est plus verbeux que le `v-model` couplé au state local, et on perd quelques fonctionnalités pratiques de `v-model` au passage. Une approche alternative consiste à utiliser une computed property bi-directionnelle avec un setter :

``` html
<input v-model="message">
```
``` js
// ...
computed: {
Expand Down
3 changes: 3 additions & 0 deletions docs/ja/forms.md
Original file line number Diff line number Diff line change
Expand Up @@ -42,6 +42,9 @@ mutations: {

確かに、上記の例は単純な `v-model` と ローカルステートよりもかなり冗長で、`v-model` のいくつかの有用な機能が使えません。代わりに、セッターで双方向算出プロパティを使うアプローチがあります。

``` html
<input v-model="message">
```
``` js
computed: {
message: {
Expand Down
3 changes: 3 additions & 0 deletions docs/kr/forms.md
Original file line number Diff line number Diff line change
Expand Up @@ -42,6 +42,9 @@ mutations: {

틀림없이, 위의 내용은 `v-model` + 지역 상태보다 좀더 장황 해졌고, `v-model`의 유용한 기능 중 일부를 잃어 버렸습니다. 다른 방법은 setter를 사용하여 양방향 계산된 속성을 사용하는 것입니다.

``` html
<input v-model="message">
```
``` js
// ...
computed: {
Expand Down
4 changes: 3 additions & 1 deletion docs/ru/forms.md
Original file line number Diff line number Diff line change
Expand Up @@ -42,6 +42,9 @@ mutations: {

Заметно, что получившаяся выше запись — куда многословнее, чем используемая в связке `v-model` с локальным состоянием, да и некоторые полезные возможности `v-model` мы таким образом упускаем. В качестве альтернативы можно предложить использование двунаправленного вычисляемого свойства с сеттером:

``` html
<input v-model="message">
```
``` js
// ...
computed: {
Expand All @@ -55,4 +58,3 @@ computed: {
}
}
```

4 changes: 3 additions & 1 deletion docs/zh-cn/forms.md
Original file line number Diff line number Diff line change
Expand Up @@ -42,6 +42,9 @@ mutations: {

必须承认,这样做比简单地使用“`v-model` + 局部状态”要啰嗦得多,并且也损失了一些 `v-model` 中很有用的特性。另一个方法是使用带有 setter 的双向绑定计算属性:

``` html
<input v-model="message">
```
``` js
// ...
computed: {
Expand All @@ -55,4 +58,3 @@ computed: {
}
}
```

0 comments on commit ca965cd

Please sign in to comment.