buhrmi / vue-pouch

Live and reactive PouchDB bindings for Vuejs

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

empty selector pulls deleted entries on fresh db

veber-alex opened this issue · comments

Hi,
I took the example from the front page and ran in as a test, after adding some todo entries I checked that everything synced to CouchDB and it looked fine.
After that I deleted all the entries and deleted the local PouchDB in the browser and refreshed the page.
It looks like the first load when the local DB doesn't exist somehow pulls also all the deleted entries from CouchDB, I see a lot of blank objects, doing another refresh resolves the issue.
Here is the code I used:

<template>
  <div>
    <input v-model="message" placeholder="New Todo">
    <button @click="$pouch.post('todos', {message: message});message=''">Save Todo</button>
    <div v-for="todo in todos">
      <input v-model="todo.message" @change="$pouch.put('todos', todo)">
      <button @click="$pouch.remove('todos', todo)">Remove</button>
    </div>
  </div>
</template>

<script>
  export default {
    data(){
      return {
        message: ''
      }
    },
    name: 'todo',
    // VuePouch adds a `pouch` config option to all components.
    pouch: {
      // The simplest usage. queries all documents from the "todos" pouch database and assigns them to the "todos" vue property.
      todos: {/*empty selector*/}
    },
    created: function () {
      // Send all documents to the remote database, and stream changes in real-time
      this.$pouch.sync('todos', 'http://localhost:5984/todos');
    }
  }
</script>