Passagem de adereços com a navegação programática Vue.js

Eu tenho um componente Vue que possui um suporte chamado 'title', por exemplo:

<script>
export default {
  props: ['title'],
  data() {
    return {
    }
  }
}
</script>

Navego para o componente programaticamente após a conclusão de uma determinada ação. Existe uma maneira de rotear programaticamente um usuário enquanto também define o valor prop? Eu sei que você pode criar um link como este:

<router-link to="/foo" title="example title">link</router-link>

No entanto, existe uma maneira de fazer algo como o seguinte?

this.$router.push({ path: '/foo', title: 'test title' })

EDITAR:

Conforme sugerido, alterei minha rota para o seguinte:

   {
      path: '/i/:imageID',
      component: Image,
      props: true
    }

E a navegação para o seguinte:

this.$router.push({ path: '/i/15', params: {title: 'test title' }})

No entanto, meu componente Imagem (modelo - veja abaixo) ainda não mostra nenhum título.

<h1>{{ title}}</h1>

Existe algo que possa estar causando problemas?

questionAnswers(2)

yourAnswerToTheQuestion