Руководство
Основы
- Установка
- Введение
- Экземпляр Vue
- Синтаксис шаблонов
- Вычисляемые свойства и слежение
- Работа с классами и стилями
- Условная отрисовка
- Отрисовка списков
- Обработка событий
- Работа с формами
- Основы компонентов
Продвинутые компоненты
- Регистрация компонентов
- Входные параметры
- Пользовательские события
- Слоты
- Динамические и асинхронные компоненты
- Обработка крайних случаев
Переходы и анимации
- Анимирование списков и появления/исчезновения
- Анимирование переходов между состояниями
Переиспользование и композиция
- Примеси
- Пользовательские директивы
- Render-функции и JSX
- Плагины
- Фильтры
Инструментарий
- Однофайловые компоненты
- Тестирование
- Поддержка TypeScript
- Публикация на production
Масштабирование
- Роутинг
- Управление состоянием приложения
- SSR. Отрисовка на стороне сервера
- Безопасность
Продвинутые темы
- Подробно о реактивности
Вопросы миграции
- Миграция с Vue 1.x
- Миграция с Vue Router 0.7.x
- Миграция с Vuex 0.6.x на 1.0
Мета
- Сравнение с другими фреймворками
- Присоединяйтесь к сообществу Vue.js!
- Познакомьтесь с командой
Эта документация для версий v2.x и ранее. Для v3.x, документация здесь.
Плагины
Плагины позволяют добавить во Vue некоторую глобальную функциональность. Область применения плагинов явно не определена. Можно разделить плагины на нескольких типов:
Добавляют глобальные методы и/или свойства, например vue-custom-element
Добавляют глобальные объекты: директивы/фильтры/переходы и т.д., например vue-touch
Добавляют опции компонентам через глобальную примесь, например vue-router
Добавляют методы экземпляра Vue через Vue.prototype.
Библиотеки, предоставляющие собственные API и комбинирующие вышеперечисленные возможности, например vue-router
Использование плагинов
Для использования плагина необходимо вызвать глобальный метод Vue.use()
. Его нужно вызывать перед new Vue()
:
// вызывает `MyPlugin.install(Vue)`
Vue.use(MyPlugin)
new Vue({
//... настройки
})
Можно передавать дополнительные параметры в плагин:
Vue.use(MyPlugin, { someOption: true })
Vue.use
автоматически предотвращает многократную регистрацию плагина. Несколько вызовов Vue.use
для одного плагина установит его лишь один раз.
Некоторые официальные плагины Vue.js, такие как vue-router
, автоматически вызывают Vue.use()
, если обнаружат глобальную переменную Vue
. Однако при использовании инструментов модульного окружения, например CommonJS, необходимо всегда вызывать Vue.use()
явно:
// При использовании CommonJS посредством Browserify или Webpack
var Vue = require('vue')
var VueRouter = require('vue-router')
// Не забудьте этот вызов!
Vue.use(VueRouter)
Обратите внимание на awesome-vue — огромную коллекцию плагинов и библиотек от сообщества Vue.
Создание плагина
Плагин Vue.js должен содержать метод install
. Этот метод будет вызываться с конструктором Vue
в качестве первого аргумента, и с дополнительными опциями плагина в качестве второго (если передавались):
MyPlugin.install = function (Vue, options) {
// 1. добавление глобального метода или свойства
Vue.myGlobalMethod = function () {
// некоторая логика ...
}
// 2. добавление глобального объекта
Vue.directive('my-directive', {
bind (el, binding, vnode, oldVnode) {
// некоторая логика ...
}
...
})
// 3. добавление опций компонентов
Vue.mixin({
created: function () {
// некоторая логика ...
}
...
})
// 4. добавление метода экземпляра
Vue.prototype.$myMethod = function (methodOptions) {
// некоторая логика ...
}
}