Skip to content

Commit f1c7a4d

Browse files
committed
Translates 'guide/component-custom-events.md'
* Section 'Handling `v-model` modifiers'
1 parent ce0a4b1 commit f1c7a4d

File tree

1 file changed

+7
-7
lines changed

1 file changed

+7
-7
lines changed

src/guide/component-custom-events.md

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -141,15 +141,15 @@ app.component('user-name', {
141141
</p>
142142
<script async src="https://static.codepen.io/assets/embed/ei.js"></script>
143143

144-
## Handling `v-model` modifiers
144+
## Manipulando modificadores `v-model`
145145

146-
When we were learning about form input bindings, we saw that `v-model` has [built-in modifiers](/guide/forms.html#modifiers) - `.trim`, `.number` and `.lazy`. In some cases, however, you might also want to add your own custom modifiers.
146+
Quando estávamos aprendendo sobre interligações em elementos *input*, vimos que `v-model` tem [modificadores embutidos](/guide/forms.html#modifiers) - `.trim`, `.number` e `.lazy`. Em alguns casos, entretanto, você também pode querer adicionar seus próprios modificadores personalizados.
147147

148-
Let's create an example custom modifier, `capitalize`, that capitalizes the first letter of the string provided by the `v-model` binding.
148+
Vamos criar um modificador personalizado de exemplo, `capitalize`, que coloca em maiúscula a primeira letra da string fornecida pela vinculação `v-model`.
149149

150-
Modifiers added to a component `v-model` will be provided to the component via the `modelModifiers` prop. In the below example, we have created a component that contains a `modelModifiers` prop that defaults to an empty object.
150+
Modificadores adicionados a um componente `v-model` serão fornecidos ao componente por meio da propriedade `modelModifiers`. No exemplo abaixo, criamos um componente que contém uma propriedade `modelModifiers` cujo padrão é um objeto vazio.
151151

152-
Notice that when the component's `created` lifecycle hook triggers, the `modelModifiers` prop contains `capitalize` and its value is `true` - due to it being set on the `v-model` binding `v-model.capitalize="bar"`.
152+
Observe que quando o gancho do ciclo de vida `created` do componente é acionado, a propriedade `modelModifiers` contém `capitalize` e seu valor é `true` - devido ao fato de ser definido na vinculação `v-model.capitalize="bar"`.
153153

154154
```html
155155
<my-component v-model.capitalize="bar"></my-component>
@@ -174,7 +174,7 @@ app.component('my-component', {
174174
})
175175
```
176176

177-
Now that we have our prop set up, we can check the `modelModifiers` object keys and write a handler to change the emitted value. In the code below we will capitalize the string whenever the `<input />` element fires an `input` event.
177+
Agora que temos nossa propriedade configurada, podemos verificar as chaves do objeto `modelModifiers` e escrever um manipulador para alterar o valor emitido. No código a seguir, colocaremos a string em maiúscula sempre que o elemento `<input />` disparar um evento `input`.
178178

179179
```html
180180
<div id="app">
@@ -217,7 +217,7 @@ app.component('my-component', {
217217
app.mount('#app')
218218
```
219219

220-
For `v-model` bindings with arguments, the generated prop name will be `arg + "Modifiers"`:
220+
Para as ligações `v-model` com argumentos, o nome da propriedade gerada será `arg + "Modifiers"`:
221221

222222
```html
223223
<my-component v-model:foo.capitalize="bar"></my-component>

0 commit comments

Comments
 (0)