From cf01e6ec11903fbd05910d4fe85ecc2bc14b91a9 Mon Sep 17 00:00:00 2001 From: Alex Sokolov Date: Thu, 11 May 2017 11:10:12 +0300 Subject: [PATCH 1/5] =?UTF-8?q?data.md=20=D0=98=D1=81=D0=BF=D1=80=D0=B0?= =?UTF-8?q?=D0=B2=D0=BB=D0=B5=D0=BD=20=D0=BF=D1=80=D0=B8=D0=BC=D0=B5=D1=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- ru/data.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/ru/data.md b/ru/data.md index b47b31a7..13d3ac9d 100644 --- a/ru/data.md +++ b/ru/data.md @@ -97,7 +97,7 @@ export default { computed: { // отображаем элемент из состояния хранилища. - items () { + item () { return this.$store.state.items[this.$route.params.id] } } From 2d88a11bd5476136c1aaf094429b6fa1f030367e Mon Sep 17 00:00:00 2001 From: Alex Sokolov Date: Fri, 12 May 2017 11:18:36 +0300 Subject: [PATCH 2/5] =?UTF-8?q?universal.md=20=D0=B4=D0=BE=D0=B1=D0=B0?= =?UTF-8?q?=D0=B2=D0=BB=D0=B5=D0=BD=20=D0=B0=D0=B1=D0=B7=D0=B0=D1=86?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- ru/universal.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/ru/universal.md b/ru/universal.md index edcd436f..60179795 100644 --- a/ru/universal.md +++ b/ru/universal.md @@ -12,6 +12,8 @@ Так как динамических обновлений нет, из всех хуков жизненного цикла будут вызваны только `beforeCreate` и `created` во время серверного рендеринга (SSR). Это означает, что код внутри любых других хуков жизненного цикла, таких как `beforeMount` или `mounted`, будет выполняться только на клиенте. +Стоит ещё отметить, что вам следует избегать кода, который производит глобальные побочные эффекты (side effects) в хуках `beforeCreate` и `created`, например устанавливая таймеры с помощью `setInterval`. В коде на стороне клиента мы можем установить таймер, а затем остановить его в `beforeDestroy` или `destroyed`. Но, поскольку хуки уничтожения не будут вызываться во время SSR, таймеры останутся навсегда. Чтобы избежать этого, переместите такой код в `beforeMount` или `mounted`. + ## Доступ к специализированному API платформы Универсальный код не может использовать API специализированное для какой-то конкретной платформы (platform-specific APIs), потому что если ваш код будет использовать глобальные переменные браузеров `window` или `document`, то возникнут ошибки при выполнении в Node.js, и наоборот. From f521236fcd432d20d684f12d7c89f8d10bc6e07e Mon Sep 17 00:00:00 2001 From: Alex Sokolov Date: Fri, 12 May 2017 11:25:43 +0300 Subject: [PATCH 3/5] =?UTF-8?q?data.md=20=D1=80=D0=B0=D0=B7=D0=B4=D0=B5?= =?UTF-8?q?=D0=BB=D0=B5=D0=BD=D0=B8=D0=B5=20=D0=BA=D0=BE=D0=B4=D0=B0=20?= =?UTF-8?q?=D1=85=D1=80=D0=B0=D0=BD=D0=B8=D0=BB=D0=B8=D1=89=D0=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- ru/data.md | 57 ++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 57 insertions(+) diff --git a/ru/data.md b/ru/data.md index 13d3ac9d..809b78d6 100644 --- a/ru/data.md +++ b/ru/data.md @@ -254,6 +254,63 @@ Vue.mixin({ }) ``` +## Разделение кода хранилища + +В большом приложении хранилище Vuex будет скорее всего разделено на несколько модулей. Конечно, также можно разделить код этих модулей на соответствующие фрагменты компонента маршрута. Предположим, что у нас есть следующий модуль хранилища: + +``` js +// store/modules/foo.js +export default { + namespaced: true, + // ВАЖНО: state должен быть функцией, чтобы + // модуль мог инстанцироваться несколько раз + state: () => ({ + count: 0 + }), + actions: { + inc: ({ commit }) => commit('inc') + }, + mutations: { + inc: state => state.count++ + } +} +``` + +Мы можем использовать `store.registerModule` для lazy-регистрации этого модуля в хуке `asyncData` компонента маршрута: + +``` html +// внутри компонента маршрута + + + +``` + +Поскольку модуль теперь является зависимостью компонента маршрута, он будет перемещён в асинхронный фрагмент компонента маршрута с помощью Webpack. + --- Фух, это было много кода! Это связано с тем, что универсальная загрузка данных является, вероятно, самой сложной проблемой в приложении с рендерингом на стороне сервера, и таким образом мы закладываем хороший фундамент для облегчения дальнейшей разработки. После создания такой заготовки, создание отдельных компонентов будет приятным занятием. From b543706f9ea3dbe4467279d44a5f5fd9f8866b40 Mon Sep 17 00:00:00 2001 From: Alex Sokolov Date: Tue, 16 May 2017 08:46:26 +0300 Subject: [PATCH 4/5] =?UTF-8?q?api.md=20=D0=B8=D1=81=D0=BF=D1=80=D0=B0?= =?UTF-8?q?=D0=B2=D0=BB=D0=B5=D0=BD=D0=B8=D0=B5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- ru/api.md | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/ru/api.md b/ru/api.md index 82aea676..43e6c079 100644 --- a/ru/api.md +++ b/ru/api.md @@ -82,9 +82,8 @@ const renderer = createBundleRenderer(serverBundle, { ... }) - #### `clientManifest` - 2.3.0+ - - используется только в `createBundleRenderer` - Предоставляет объект манифеста клиентской сборки, сгенерированный `vue-server-renderer/server-plugin`. Клиентский манифест предоставляет для рендерера сборки необходимую информацию для автоматического внедрения ресурсов в шаблон HTML. Подробнее в разделе [Генерация `clientManifest`](./build-config.md#generating-clientmanifest). + Предоставляет объект манифеста клиентской сборки, сгенерированный `vue-server-renderer/client-plugin`. Клиентский манифест предоставляет для рендерера сборки необходимую информацию для автоматического внедрения ресурсов в шаблон HTML. Подробнее в разделе [Генерация `clientManifest`](./build-config.md#generating-clientmanifest). - #### `inject` From 788ebe3ab70bebc9a3c986df8f2d2011fe1bdb73 Mon Sep 17 00:00:00 2001 From: Alex Sokolov Date: Fri, 19 May 2017 08:35:49 +0300 Subject: [PATCH 5/5] =?UTF-8?q?basic.md=20=D0=BF=D1=80=D0=B0=D0=B2=D0=BA?= =?UTF-8?q?=D0=B8=20=D0=BA=D0=BE=D0=BC=D0=BC=D0=B5=D0=BD=D1=82=D0=B0=D1=80?= =?UTF-8?q?=D0=B8=D0=B5=D0=B2?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- ru/basic.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/ru/basic.md b/ru/basic.md index 241e8339..5a8ef8d9 100644 --- a/ru/basic.md +++ b/ru/basic.md @@ -110,10 +110,10 @@ renderer.renderToString(app, (err, html) => { ``` html - + {{ title }} - + {{{ meta }}}