Библиотека знаний - js:vuejs

UI + Vue (UI Bootstrap итд)

Anonymous (anonymous@undisclosed.example.com) — 2019-02-22T00:56:21+00:00

js, javascript, ui, vue, framework, css, bootstrap

UI + Vue (UI Bootstrap итд)

Компоненты

Anonymous (anonymous@undisclosed.example.com) — 2019-03-08T21:49:43+00:00

Компоненты

Заголовок

router

Состояния / Store

https://vuex.vuejs.org/ru/ - Vuex — это паттерн управления состоянием и библиотека для приложений на Vue.js. Он служит центральным хранилищем данных для всех компонентов приложения и обеспечивает предсказуемость изменения данных при помощи определённых правил.
- https://habr.com/post/322354/
- https://habr.com/company/zfort/blog/336482/
https://github.com/monterail/vuelidate

HTTP clients like ($.get(), $.post())

Лоадеры

При использовании vue-loader или vueify шаблоны внутри файлов *.vue будут скомпилированы в JavaScript на этапе сборки. Вам не потребуется компилятор в финальной сборке, а значит можно использовать сборки runtime-only.

https://github.com/vuejs/vueify
https://vue-loader-v14.vuejs.org/ru/ - это загрузчик для webpack, который преобразует Vue компоненты
https://github.com/vuejs/vue-loader

Виджеты / Компоненты

Списки

https://vue-multiselect.js.org/ (Демо)

Фома

https://github.com/vue-generators/vue-form-generator

Календарь / Выбор даты / Выбор времени

Пагинатор

https://github.com/lokyoung/vuejs-paginate

Дерево / Списки

Автокомплит

Select 2 и аналоги

Драг анд Дроп

https://github.com/SortableJS/Vue.Draggable

Таблицы

Остальные

Репозитории / Каталоги

Документация

Anonymous (anonymous@undisclosed.example.com) — 2019-03-08T21:53:31+00:00

js, vuejs, framework

Документация

Документация
API (rus)

Рабочий процесс

Объект VueJs

Vue.use({
    install: function(Vue, options) {
 
        Vue.mixin({
 
        });
 
}, {
    createComputed: true
});    	
 
var app = new Vue({
    // Используется в раннем связывании
    el: '#app',
    name: 'nameApp',
    //
    props: [
    ],
    //
    data() {
    },
    //
    methods: {
    },
    //
    computed: {
    },
    //
    watch: {
    },
    //
    components: {
    },
    // Событие перед созданием компонента
    beforeCreate() {
    },
    // Событие после создания компонента
    created() {
    },
    // 
    beforeMount() {
    },  
});

Глобальная конфигурация

Vue.config - это объект, содержащий глобальные конфигурации Vue. Вы можете изменить свои свойства, перечисленные ниже, перед загрузкой приложения:

Vue.config.silent = true
Vue.config.devtools = true
Vue.config.errorHandler = function (err, vm, info) { ... }
Vue.config.warnHandler = function (msg, vm, trace) { ... }
Vue.config.ignoredElements = [
/^ion-/,
'another-web-component' ]
Vue.config.keyCodes = {}

Конструкции html (атрибуты)

v-bind, : - Связывает HTML атрибут с переменными или методом (:href, :src), также можно применять java-script выражения
v-on, @ - Методы (click, change, blur, etc) или в нативной декларации (onClick, onChange, onBlur)
- click.modifiers
v-model - Связывает входной параметр value и событие input (двусторонняя привязка)
v-for - Конструкциия for для массива или для массива возвращенного методом
```
<div :v-for="method in methods"></div>
```
v-if - Конструкция if значение переменной или переменая возращаемоя методом (скрывает или показывает тэг)
v-html - Вывод HTML
v-show -
:is - наименование компонента, если по какой-либо причине нельзя испозовать тег в качестве названия компонента
```
<div :is="com1"><div>

<com-1></com-1>
```

Свойства объекта

data: {}
methods: {}
computed: {} - Отслеживает переменные внутри методов декларированных в computed (возвращает значение)
props: [] - Аналогично объявлению входящих в функцию параметрах
wath: {} - Отслеживает изменение именованных как метод переменных
template: "" -
model: {}
components: {} - Список копонентов
filters: {} - Применяются для обработке в выводе {{ | filterName}}

directives: {} - Методы представляют из себя директивы v-todo-focus, имена методов указываются без v-

Пример

<input class="edit" type="text" v-model="todo.title" v-todo-focus="todo == editedTodo" @blur="doneEdit(todo)" @keyup.enter="doneEdit(todo)" @keyup.esc="cancelEdit(todo)">

mountend: {} -

Методы объекта

this.$emit() - Вызов метода дочернего компанента
this.$el - виртуальный дом
this.$mount(selector) - При этом необходимо из app удалить указание елемента el
this.$refs - Ссылки на реальный дом елементы
- ```
<element-name ref="">
```
this.$resource - Сторонний модуль vue-resource (не входит в vuejs)
this.$slots - Позмоляет передавать HTML, в качестве строки (В шаблоне необходимо использовать тэг <slot>, так - же он может быть именован <slot name="myslot">)

События

beforeCreate
created
beforeMount
mounted
beforeUpdate
updated
beforeDestroy
destroyed
activated
deactivated
errorCaptured

Хуки

created - Компанент собран, но не помещен в дом

Element (A Desktop UI Library)

Anonymous (anonymous@undisclosed.example.com) — 2018-01-02T04:39:34+00:00

Element (A Desktop UI Library)

Дополнения

http://nosir.github.io/cleave.js/

Документация

http://element.eleme.io/#/en-US/component/layout

Примеры

Вопрос / Ответ

Anonymous (anonymous@undisclosed.example.com) — 2018-06-09T20:05:04+00:00

Вопрос / Ответ

Вызовы компонентов

Frameworks

Anonymous (anonymous@undisclosed.example.com) — 2018-06-09T16:22:02+00:00

Frameworks

Nuxt.js

Компоненты для vuejs

Anonymous (anonymous@undisclosed.example.com) — 2018-04-28T17:45:17+00:00

Компоненты для vuejs

https://vuejsexamples.com/

Widgets / Виджеты

HTTP client

https://github.com/pagekit/vue-resource

Список библиотек

* Библиотеки и компоненты

Препроцессоры

Anonymous (anonymous@undisclosed.example.com) — 2018-06-09T16:20:51+00:00

Препроцессоры

https://pugjs.org/api/getting-started.html

Репозитории

Anonymous (anonymous@undisclosed.example.com) — 2019-03-08T21:58:07+00:00

js, vuejs, ui

Репозитории

https://github.com/vuetifyjs

UI

Anonymous (anonymous@undisclosed.example.com) — 2024-11-15T22:25:33+00:00

js, vuejs, ui

Библиотека знаний - js:vuejs

UI + Vue (UI Bootstrap итд)

UI + Vue (UI Bootstrap итд)

Компоненты

Компоненты

Заголовок

router

Состояния / Store

HTTP clients like ($.get(), $.post())

Лоадеры

Виджеты / Компоненты

Списки

Фома

Календарь / Выбор даты / Выбор времени

Пагинатор

Дерево / Списки

Автокомплит

Select 2 и аналоги

Драг анд Дроп

Таблицы

Картинки / Обработка

Редакторы

Поиск

Слайдеры

Графики

Остальные

Репозитории / Каталоги

Документация

Документация

Рабочий процесс

Объект VueJs

Глобальная конфигурация

Конструкции html (атрибуты)

Свойства объекта

Методы объекта

События

Хуки

Element (A Desktop UI Library)

Element (A Desktop UI Library)

Дополнения

Документация

Примеры

Вопрос / Ответ

Вопрос / Ответ

Frameworks

Frameworks

Компоненты для vuejs

Компоненты для vuejs

Widgets / Виджеты

HTTP client

Список библиотек

Препроцессоры

Препроцессоры

Репозитории

Репозитории

UI

UI