Skip to content

2.6.3 broke Vue Router on Mobile Safari #9462

Closed
@NonSpicyBurrito

Description

@NonSpicyBurrito

Version

2.6.3

Reproduction link

https://github.com/NonSpicyBurrito/vueissue

Steps to reproduce

  1. Create a project with Vue CLI 3, manual: Babel, Vue Router, Lint
  2. Add simple test buttons to generated Home and About page
    Home.vue
<template>
  <div class="home">
    <button @click="test++">{{test}}</button>
    <br>
    <img alt="Vue logo" src="../assets/logo.png">
    <HelloWorld msg="Welcome to Your Vue.js App"/>
  </div>
</template>

<script>
// @ is an alias to /src
import HelloWorld from '@/components/HelloWorld.vue'

export default {
  name: 'home',
  components: {
    HelloWorld
  },
  data () {
    return {
      test: 100
    }
  }
}
</script>

About.vue

<template>
  <div class="about">
    <button @click="test++">{{test}}</button>
    <h1>This is an about pagennn</h1>
  </div>
</template>

<script>
export default {
  name: 'About',
  data () {
    return {
      test: 100
    }
  }
}
</script>

Relevant version:

  • Vue: 2.6.3
  • Vue Router: 3.0.2
  • iOS & Safari: 9.3.5

What is expected?

Test buttons work normally on mobile Safari

What is actually happening?

  1. navigate to Home page, test button works
  2. navigate to About page, test button does not work
  3. navigate back to Home page, test button does not work anymore

The same setup works as expected with Vue 2.5.22, so it's likely that something in 2.6.3 broke it.
I don't know how to debug mobile Safari so I can't see the cause of it.

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions