v-model .sync modifier deprecation in Vue 3.2 migration

Direct Answer

There is no Vue 3.2 deprecation of .sync to suppress, because .sync was already removed in Vue 3.0. In any Vue 3.x release, the two-way binding mechanism is v-model with arguments: the parent writes v-model:foo="bar" and the child emits update:foo. If you are seeing .sync-related messages, the most likely explanation is that your template is still being processed by Vue 2 tooling or an old compiler, not that Vue 3.2 introduced a new deprecation. Confirm your installed versions before planning around a warning that may not exist.

What Is Confirmed

• Vue 2 supported :foo.sync="bar" as sugar for :foo="bar" plus an update:foo listener.
• Vue 3 removed .sync and unified the pattern under v-model with arguments, which also allows multiple models per component (v-model:first, v-model:last).
• Vue 3 runtime configuration lives on the app instance (app.config.warnHandler, app.config.silent), not on a global Vue.config object as in Vue 2.

What Is Uncertain

I cannot verify a Vue 3.2 runtime warning stating ".sync is deprecated and will be removed in Vue 3.3". Treat that specific claim as unconfirmed and check the actual console output in your project. If a warning appears, note its exact text and your vue and @vue/compiler-sfc versions — that detail determines whether you are dealing with a Vue 2 leftover, a third-party library emitting its own warning, or a misconfigured build.

Migration Steps

1. Inventory: search for \.sync across .vue files and template strings.
2. Update children: each component that mutated a synced prop must instead emit update:propName with the new value. Direct prop mutation breaks one-way data flow regardless of warnings.
3. Update parents: replace :prop.sync="value" with v-model:prop="value".
4. Verify: run the dev build and confirm behavior is unchanged and no related console output remains.

Nested Prop Bindings

Two reliable patterns for bindings like :user.name.sync="form.name":

1. Computed proxy on the parent, emitting an update for the top-level object:

computed: {
  userName: {
    get() { return this.user.name; },
    set(val) { this.$emit('update:user', { ...this.user, name: val }); }
  }
}

1. Object replacement: bind v-model:user and have the child emit update:user with a new object containing the changed field. This preserves immutability and works well with multiple nested fields.

If You Need Temporary Warning Filtering

Vue 3 has no flag that silences one specific deprecation. You can filter messages on the app instance during a phased migration:

const app = createApp(App);
const original = app.config.warnHandler;
app.config.warnHandler = (msg, instance, trace) => {
  if (typeof msg === 'string' && msg.includes('.sync')) return;
  if (original) original(msg, instance, trace);
};

Remove this before shipping; filtering hides other warnings you need during upgrades. Avoid app.config.silent = true for the same reason — it suppresses everything.

Tooling Note

Codemods and generators that still emit :prop.sync must be updated to produce v-model:prop; the Vue 3 compiler will not rewrite the old syntax for you.