# Modificadores KeyCode
breaking
# Visão Geral
Aqui está um resumo rápido do que mudou:
- BREAKING: Usando números, i.e. keyCodes, como em modificadores
v-onnão é mais suportado - BREAKING:
config.keyCodesnão é mais suportado
# Sintaxe v2.x
No Vue 2, keyCodes eram suportados como uma maneira de modificar um método v-on.
<!-- versão usando keyCode -->
<input v-on:keyup.13="submit" />
<!-- versão usando apelido -->
<input v-on:keyup.enter="submit" />
1
2
3
4
5
2
3
4
5
Adicionalmente, você podia definir seus próprios apelidos através da configuração global config.keyCodes.
Vue.config.keyCodes = {
f1: 112
}
1
2
3
2
3
<!-- versão usando keyCode -->
<input v-on:keyup.112="showHelpText" />
<!-- versão usando apelido customizado -->
<input v-on:keyup.f1="showHelpText" />
1
2
3
4
5
2
3
4
5
# Sintaxe v3.x
Uma vez que KeyboardEvent.keyCode virou obsoleto (opens new window), não faria mais sentido para o Vue 3 continuar à suportá-lo também. Como resultado, agora é recomendado utilizar o nome em kebab-case para qualquer tecla que você utilizar como um modificador.
<!-- Modificador de tecla do Vue 3 no v-on -->
<input v-on:keyup.delete="confirmDelete" />
1
2
2
Como um resultado, isso significa que config.keyCodes também está obsoleto e não será mais suportado.
# Estratégia de Migração
Para aqueles que utilizam keyCode em sua base de código, nós recomendamos convertê-los para os nomes kebab-cased equivalentes.