watchSyncEffect() Efeito colateral executado de forma síncrona
Última atualização: 2026-10-22
watchSyncEffect() Efeito colateral executado de forma síncrona
watchSyncEffect() equivale a watchEffect com flush: 'sync': executa imediatamente de forma síncrona assim que a dependência muda, sem agrupamento (batching).
| Grupo | Reatividade: Essencial |
|---|---|
| Tipo | API |
| Escopo | No Componente |
| Versão do Vue | 3.0+ |
| Suporte a SSR | Sim |
📝 Sintaxe
watchSyncEffect(() => {
console.log('executa de imediato', count.value)
})⚙️ Argumentos
| effect | Função de efeito colateral; as opções são as mesmas do watchEffect (sem flush) |
|---|
Retorno：Uma função stop para interromper a observação
▶ Exemplo
Edite o código abaixo e veja o resultado ao vivo:
Saída：
A +2 click logs twice (e.g. '2 2'); with default flush you would see the final value once.💡 Pontos-chave
⚠️ Aviso A execução síncrona pula o agrupamento e, em cenários de mudanças em alta frequência, o custo de desempenho é evidente — use apenas quando precisar capturar cada mudança com precisão.
ℹ️ Nota Usos típicos: rastreamento em depuração e cenários que exigem registrar cada mudança em ordem estrita.
💡 Dica Se der para resolver com watch (pre padrão) + nextTick, evite o modo sync.
🏷️ Essencial relacionados
💡 Casos Relacionados
Mais casos em breve.
📚 Tutoriais Relacionados
❓ FAQ
P Qual a diferença entre o modo sync e o modo padrão?
R O padrão agrupa várias alterações da mesma rodada em uma única execução; no sync, cada alteração dispara uma execução imediata.
P Fica mais propenso a problemas de desempenho?
R Sim: cada atribuição roda o efeito colateral de forma síncrona, e alterações dentro de loops amplificam o custo linearmente.
P Dá para obter os valores antigos e novos?
R Não — ele é da família do watchEffect; para valores antigos e novos, use watch com flush: 'sync'.
