[Vuejs]-Vue Refresh page with realtime data

Created will only be executed once in your component lifecycle. At this point the value of liveData is always false.
If you click on your "button" the value should change but your code inside of created will not be executed once more.

Instead of created you can use an immediate watcher:

watch: {
  liveData: {
    immediate: true,
    handler(val) {
      // your code from created here
    }
}

Correct the mistake

<div v-else!="liveData">

<div v-if="liveData">
    <div @click="liveData = false">
        Turn OFF Live data
    </div>
</div>
<div v-else!="liveData">
    <div @click="liveData = true">
        Turn On Live data
    </div>
</div>

or

<div v-else>