@vuejs_ru
Vue.js — русскоговорящее сообщество

Общаемся на темы, посвященные Vue.js и опыту его использования. Проблемы. Новости. Решения. См. также: @js_ru, @react_js, @angular_ru, @nuxtjs_ru Вакансии только тут: @javascript_jobs

3988 members

Архив канала @vuejs_ru 29 ноября 2016 г.

08:13:03 ДП
User 272005161
Доброго времени суток, вопрос: можно ли както сменить елемент для app, или повесить app на несколько елементов одновременно, ибо блоков много, а дублировать код не хочется
08:13:59 ДП
User 552804
компоненты?
08:18:11 ДП
User 272005161
вешать тогда vue на весь документ или как?
08:37:50 ДП
08:37:55 ДП
User 215699186
На весь
09:14:36 ДП
User 175535891
Ребята, а можно попросить вас ткнуть пальцем на ресурсы по обучению vue2. Разного уровня подготовки. Спасибо.
09:15:16 ДП
09:15:51 ДП
User 55423102
Документация?)
09:16:19 ДП
User 55423102
Кстати на русском уже вроде почти готова, но официально никуда не выложили ещё
09:16:33 ДП
User 215699186
скринкасты на ютубе посмотри
09:16:58 ДП
User 55423102
Я там только на первую версию встречал скринкасты
09:17:05 ДП
User 55423102
Или уже наснимали?
09:17:48 ДП
User 215699186
незнаю, не смотрел даже на 1ую, просто видел что есть
09:18:08 ДП
User 175535891
Оф дока хорошо, но по ней джунам трудно ориентироваться.
09:18:28 ДП
User 215699186
нифига не сложно, я джун и мне норм
10:42:54 ДП
User 552804
привет
10:43:10 ДП
User 552804
делаю select2 в vue в mounted
10:43:24 ДП
User 552804
$("#tags").select2({
  tags: true,
  createTag: function(newTag) {
    $this.formInputs.tags = 'new:' + newTag.term;
    return {
       id: 'new:' + newTag.term,
       text: newTag.term + ' (new)'
    };
  }
}).trigger('change').on("change", function(e) {
  $this.formInputs.tags = $(this).val();
});
10:43:30 ДП
User 552804
теги
10:43:38 ДП
User 552804
при изменении тегов записываю в переменную
10:44:00 ДП
User 552804
почему то при загрузке страницы при инициализации vue или select2 по умолчанию ставится первый тег из списка
10:44:25 ДП
User 552804
в vue
formInputs: {
     tags: [],
},
10:45:50 ДП
User 552804
кfк сделать чтобы по умолчанию тег не выбирался никакой
10:46:09 ДП
10:46:24 ДП
User 552804
вне vue с тем же самым select2 не выбирается никакой тег изначально
10:50:10 ДП
User 55423102
а у россии value случаем не пустая строка?
10:50:17 ДП
10:50:52 ДП
User 55423102
jsfiddle сделаешь? :)
10:50:55 ДП
10:50:59 ДП
User 552804
щас попробую)
10:51:46 ДП
User 55423102
попробуй кстати добавить еще пустой option
10:55:22 ДП
User 55423102
А что в data лежит?
10:56:17 ДП
User 55423102
$this.formInputs.tags = 'new:' + newTag.term;
вот эта строка зачем
10:56:54 ДП
User 552804
User 55423102
попробуй кстати добавить еще пустой option
вот так вышло
10:57:03 ДП
User 552804
добавил элемент null => null
10:57:13 ДП
User 552804
e меня просто форма генерится
10:57:38 ДП
User 552804
{!! Form::select('tags[]', [null => null] + $array, null, ['id' => 'tags', 'class' => 'form-control', 'multiple']) !!}
10:57:45 ДП
10:57:53 ДП
User 55423102
при создании тега вряд ли тебе нужно закидывать во vue прям там... это в change произойдет
10:58:50 ДП
User 552804
спасибо, все работает
10:59:12 ДП
User 552804
блин, не совсем))
10:59:22 ДП
User 55423102
ну ты уж определись)
10:59:51 ДП
10:59:58 ДП
User 552804
при выборе любого тега ставится пустой еще
11:00:02 ДП
User 55423102
в общем пустой элемент похоже не нужен :)
11:00:07 ДП
User 55423102
убери в createTag
11:00:09 ДП
User 55423102
$this.formInputs.tags = 'new:' + newTag.term;
11:00:52 ДП
User 552804
но мне это нужно
11:00:54 ДП
User 552804
это смотри
11:01:05 ДП
User 55423102
под $this я как понимаю у тебя vue
11:01:18 ДП
11:01:32 ДП
User 55423102
ну и зачем при создании тега туда тег пихать
11:01:36 ДП
User 552804
блин, стой)
11:01:38 ДП
User 55423102
если в change это произойти должно
11:01:40 ДП
11:01:48 ДП
User 55423102
да я сижу
11:01:49 ДП
User 552804
да, точно
11:01:53 ДП
User 552804
но это не помогло
11:02:47 ДП
11:02:48 ДП
11:03:38 ДП
User 552804
{!! Form::select('tags[]', [null => null] + $array, null, ['id' => 'tags', 'class' => 'form-control', 'multiple']) !!}
и в mounted
$("#tags").select2({
  tags: true,
  placeholder: '---Выбрать---',
  createTag: function(newTag) {
    return {
       id: 'new:' + newTag.term,
       text: newTag.term + ' (new)'
    };
  }
}).trigger('change').on("change", function(e) {
  $this.formInputs.tags = $(this).val();
});
11:11:08 ДП
User 55423102
что-то я пример нашёл пустого select2
11:11:09 ДП
User 55423102
решил попроовать
11:11:15 ДП
User 55423102
а он в консоли
11:11:15 ДП
User 55423102
Uncaught Error: Option 'tags' is not allowed for Select2 when attached to a <select> element.
11:11:28 ДП
User 55423102
типа тегам нет если селект) а у тебя селект и теги
11:11:40 ДП
User 552804
в доках так норм
11:11:46 ДП
User 552804
и у меня норм
11:12:07 ДП
User 552804
я в этом jsfiddle не могу сообразить)
11:12:15 ДП
User 55423102
но хоть твоя разметка мне непонятна, там же вроде как селект генерируется)
11:12:21 ДП
11:12:59 ДП
11:13:27 ДП
User 552804
http://select2.github.io/examples.html#tags
11:14:36 ДП
User 175535891
Ребят, вопрос джуна застал в расплох: какое преимущество vue2 пред классическим спагетти в виде jquery? И почему не сразу react? 
Поясните кто как может, спасибо.
11:16:00 ДП
User 55423102
тем что неспагетти проще поддерживать)
11:18:26 ДП
User 55423102
можно и реакт, просто vue все вкусности в себя вобрал и местами попроще реакта будет
11:20:17 ДП
User 175535891
Порог вхождения сложнее в реакте?
11:20:55 ДП
User 55423102
ну со всякими стартерами уже может и нет
11:21:18 ДП
User 55423102
а если самому вкорячивать, то повозиться побольше надо будет
11:22:45 ДП
User 175535891
Хорошо, меня добавиют сбоку. NG2 чем плох?
11:24:41 ДП
User 55423102
дофига загружать пользователю надо) там около метра что ли библиотек для него надо
11:25:48 ДП
User 552804
https://jsfiddle.net/df8nosst/2/
jsfiddle.net/df8nosst/2
Test your JavaScript, CSS, HTML or CoffeeScript online with JSFiddle code editor.
11:25:51 ДП
User 552804
во, запилил
11:25:57 ДП
User 552804
гляньте кто может)
11:30:15 ДП
User 552804
если вставить пустой <option></option>
11:30:24 ДП
User 552804
то при выборе любого тега еще пустой подставляется
11:31:33 ДП
User 552804
если без vue то нет проблем никаких
11:33:26 ДП
User 55423102
https://select2.github.io/options.html#my-first-option-is-being-displayed-instead-of-my-placeholder
11:34:13 ДП
User 55423102
https://jsfiddle.net/df8nosst/4/
jsfiddle.net/df8nosst/4
Test your JavaScript, CSS, HTML or CoffeeScript online with JSFiddle code editor.
11:34:15 ДП
User 552804
но без vue то всё работает
11:34:20 ДП
User 55423102
норм теперь с пустым option
11:34:31 ДП
User 552804
выбери любой тег
11:39:04 ДП
11:39:06 ДП
User 133944225
-> created
11:39:56 ДП
User 133944225
и все работает
11:40:00 ДП
User 133944225
осталось узнать почему :)
11:41:27 ДП
User 552804
в jsfiddle работает а у меня нет)) оcталось и это понять
11:44:05 ДП
11:47:12 ДП
User 55423102
https://jsfiddle.net/df8nosst/5/
jsfiddle.net/df8nosst/5
Test your JavaScript, CSS, HTML or CoffeeScript online with JSFiddle code editor.
11:47:38 ДП
User 55423102
В formInputs добавил tags с пустым массивом
11:47:46 ДП
User 55423102
и при инициализации его подставляю
11:47:54 ДП
User 55423102
если в массиве были варианты, станут предвыбранными
11:48:18 ДП
User 55423102
и с mounted работает
11:49:55 ДП
User 552804
воооо
11:49:59 ДП
User 552804
благодарочка!!
11:50:01 ДП
User 552804
работает)
11:50:20 ДП
User 55423102
но документация у select2 черт ногу сломит, похоже проще что-то искать сразу на stackoverflow
11:50:39 ДП
User 55423102
хорошо что я когда-то не выбрал в проекте select2 использовать 😂
11:51:07 ДП
User 552804
теперь осталось еще один плагин так же победить))
11:51:19 ДП
User 552804
текстовый редактор побежден в форме, селект2 побежден
11:52:02 ДП
11:52:09 ДП
User 552804
вот с миниатюрой щас буду воевать)
11:52:30 ДП
User 55423102
о, примерно такое же делал) правда еще без vue
11:53:06 ДП
User 55423102
@perin https://codepen.io/Atinux/pen/qOvawK/
codepen.io/Atinux/pen/qOvawK
A quick example of how to use the input file with vue.js...
11:53:17 ДП
User 552804
у меня там уже плагин юзается
11:53:23 ДП
User 552804
мне надо только onchange отловить
11:53:38 ДП
User 552804
там просто еще все завязано на laravel и filemanager
12:27:02 ПП
User 552804
подскажите какой event использовать, есть у меня input через один js плагин в него вставляется значение, у плагина нет onchange, а мне надо отловить его значение и подставить в переменную vue
12:27:17 ПП
User 552804
мне надо отловить что в инпут подставилось чтото
12:27:44 ПП
User 552804
change от жквери не срабатывает если не писать в инпут а значение подставляется плагином
12:35:24 ПП
User 552804
или как это сделать событиями от vue
12:41:16 ПП
User 552804
сделал просто перед отправкой формы запись в переменную, всё работает :)
01:17:22 ПП
User 133944225
Это ты для себя пишешь ?
01:20:56 ПП
01:48:28 ПП
User 133944225
Проект ?
01:48:38 ПП
01:49:01 ПП
User 552804
ну проект на laravel, vue там использую совсем немного для одной формы
01:49:22 ПП
User 215699186
смысл для одной формы вуе?
01:49:29 ПП
User 552804
есть смысл
01:49:39 ПП
User 215699186
проект можно увидеть?ъ
01:49:44 ПП
01:49:47 ПП
User 552804
локально же
02:16:56 ПП
User 164670195
ребята, подскажите как фильтровать html? <div v-html="rawHtml | filter"></div> не работает
02:17:25 ПП
02:17:55 ПП
02:19:17 ПП
User 133750577
Не {{{ }}}случайно?
02:19:33 ПП
User 164670195
User 133750577
Не {{{ }}}случайно?
это для первого вроде?
02:21:38 ПП
User 133750577
Так по умолчанию же фильтрует. Не понял вопрос тогда
02:23:09 ПП
User 164670195
Твой пример с {{{ }}} был в первой версии vue, во второй html  вставляется через атрибут v-html, как пример <div v-html="rawHtml"></div> и я хочу его фильтровать как {{ rawText | filter }}
02:24:01 ПП
User 164670195
https://vuejs.org/v2/guide/syntax.html#Raw-HTML
vuejs.org/v2/guide/syntax.html
Vue.js - The Progressive JavaScript Framework
02:28:46 ПП
User 133750577
Не ясен мне твой вопрос. Хочешь чистый html -- добавляешь этот атрибут, хочешь фильтрацию -- не добавляешь..
02:30:48 ПП
User 55423102
В Vue.js 2 фильтры можно использовать только внутри {{ }}
02:31:01 ПП
User 55423102
ну или делать отдельную computed переменную
03:54:49 ПП
User 164670195
User 55423102
ну или делать отдельную computed переменную
понял, спасибо
04:46:42 ПП
User 552804
Learn Vue 2: Step By Step
https://laracasts.com/series/learn-vue-2-step-by-step
laracasts.com/series/learn-vue-2-step-by-step
Vue is easily one of the most exciting additions to the front-end world in many years. With its intuitive API, and the fact that it can be applied to any type of application, it's no wonder why folks have gravitated to it as much as they have. If you'd like to jump on board, let me show you, step by step, exactly what you need to know. It's the best way to learn Vue!
04:46:54 ПП
User 552804
Надеюсь полезно будет
04:47:25 ПП
User 133944225
там же 5 уроков
04:47:29 ПП
User 133944225
которые очень простые
04:47:30 ПП
04:47:38 ПП
User 552804
Пока да, еще будут
04:48:10 ПП
User 552804
Ну для многих я думаю и это будет хорошим началом)
04:49:03 ПП
User 138709614
User 55423102
В Vue.js 2 фильтры можно использовать только внутри {{ }}
В версии 2.1.0 добавили и внутрь v-bind фильтры https://gist.github.com/yyx990803/faebe22e8763f5b17572b35ed96f52fe#relaxed-filter-usage
gist.github.com/yyx990803/faebe22e8763f5b17572b35ed96f52fe
04:50:53 ПП
User 55423102
User 138709614
В версии 2.1.0 добавили и внутрь v-bind фильтры https://gist.github.com/yyx990803/faebe22e8763f5b17572b35ed96f52fe#relaxed-filter-usage
gist.github.com/yyx990803/faebe22e8763f5b17572b35ed96f52fe
Точно, проглядел как-то релиз)