FountainJS / generator-fountain-vue

Yeoman 'fountain' generator to start a webapp with Vue http://fountainjs.io
MIT License
103 stars 12 forks source link

Vuejs TODO not working as expected #18

Open vedmaque opened 7 years ago

vedmaque commented 7 years ago

Description

When I try clicking checkbox to complete item it does nothing. Todo item remains undone. When I try editing item text it becomes empty string after editing

Possible solution

Remove v-model directive from toggle checkbox. Because at first checkbox change completed property, then mutation change it again, so it remains same.

In Mutations only two parameters possible: state and payload. So it should be like this:

// in handleSave method inside TodoItem.vue
this.editTodo({id: this.todo.id, text: text});

// in mutations
  [ActionTypes.EDIT_TODO](state, payload) {
    state.todos = state.todos.map(todo =>
      todo.id === payload.id ?
        Object.assign({}, todo, {text: payload.text}) :
        todo
    );
  },

Config

Copy the content from .yo-rc.json:

{
  "generator-fountain-vue": {
    "version": "1.0.0",
    "props": {
      "framework": "vue",
      "modules": "webpack",
      "js": "babel",
      "ci": "",
      "css": "scss",
      "resolved": "/usr/local/lib/node_modules/generator-fountain-webapp/node_modules/generator-fountain-vue/generators/app/index.js",
      "namespace": "fountain-vue:app",
      "_": [],
      "sample": "todoMVC",
      "router": "router"
    }
  }
}

Environment

Node.js v6.10.0
darwin 15.6.0
yo 1.8.5
npm 3.10.10