From 5cb48d36860eb26ecbb2dfc70682afa431093f07 Mon Sep 17 00:00:00 2001 From: Winnie Hellmann Date: Thu, 12 Jul 2018 12:10:53 +0000 Subject: [PATCH] Remove old service architecture from Vue docs --- doc/development/fe_guide/img/vue_arch.png | Bin 9848 -> 0 bytes doc/development/fe_guide/vue.md | 239 +--------------------- 2 files changed, 11 insertions(+), 228 deletions(-) delete mode 100644 doc/development/fe_guide/img/vue_arch.png diff --git a/doc/development/fe_guide/img/vue_arch.png b/doc/development/fe_guide/img/vue_arch.png deleted file mode 100644 index a67706c7c1e5dce1491e92c576f95d6d8911f4ec..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 9848 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 {element.id !== todoID}); - - this.todos = newState; - } -} - -// service.js -import axios from '~/lib/utils/axios_utils' - -export default class Service { - constructor(options) { - this.todos = axios.create({ - baseURL: endpoint.todosEndpoint - }); - - } - - getTodos() { - return this.todos.get(); - } - - addTodo(todo) { - return this.todos.put(todo); - } -} -// todo_component.vue - - - -// todos_main_component.vue - - - -// index.js -import todoComponent from 'todos_main_component.vue'; - -new Vue({ - el: '.js-todo-app', - components: { - todoComponent, - }, - render: createElement => createElement('todo-component' { - props: { - someProp: [], - } - }), -}); - -``` - -The [issue boards service][issue-boards-service] -is a good example of this pattern. - ## Style guide Please refer to the Vue section of our [style guide](style_guide_js.md#vue-js) @@ -446,6 +230,5 @@ need to test the rendered output. [Vue][vue-test] guide's to unit test show us e [state-management]: https://vuejs.org/v2/guide/state-management.html#Simple-State-Management-from-Scratch [one-way-data-flow]: https://vuejs.org/v2/guide/components.html#One-Way-Data-Flow [vue-test]: https://vuejs.org/v2/guide/unit-testing.html -[issue-boards-service]: https://gitlab.com/gitlab-org/gitlab-ce/blob/master/app/assets/javascripts/boards/services/board_service.js.es6 [flux]: https://facebook.github.io/flux [axios]: https://github.com/axios/axios