[UrimTumim]

Hejej Mirki,
Mam problem z selectpickerem(bootstrap-select) i vue.
W jaki sposób zaimportować metody, bym mógł ich używać wewnątrz komponentów Vue? Dodają się style, ale nie mogę używać metod selectpickera.

Np. chciałbym wywołać metodę $('#jakisid').selectpicker()

mounted: function() {
 $('selectpicker').selectpicker();
 }

i dostaję ciągle błąd:

Error in mounted hook: "TypeError: jquery_WEBPACKIMPORTEDMODULE3___default()(...).selectpicker is not a function

(samo odpalenie $('selectpicker') oczywiście działa)

próbowałem importu wewnątrz komponentu,
import 'bootstrap';
import 'bootstrap-select';
import 'bootstrap-select/dist/css/bootstrap-select.css';
czy tam:
require('bootstrap');
require('bootstrap-select');
require('bootstrap-select/dist/css/bootstrap-select.css');

próbowałem też wrzucać cdn w public/index.html ale też to nic nie zmienia (jeżeli dodaję selectpicker w ten sposób wygląda jakby działał, ale nadal nie mogę z wewnątrz komponentów używać metod selectpickera).

#javascript #vuejs #frontend #bootstrap

[lobo]

@UrimTumim: zreprodukuj na https://codesandbox.io/index2

[lojawyk]

@UrimTumim: A czym jest ten selectpicker? Jaki to niby selektor? Wybierasz jakiś element HTML 'selectpicker'. Nie znam takiego.

[UrimTumim]

@lojawyk: oczywiście miała być nazwa klasy - połknąłem kropkę na początku (pisałem uproszczony kod na potrzeby tego wpisu) - ale to nie rozwiązuje problemu.

[lojawyk]

@UrimTumim: A jak importujesz jQuery? Co zwraca $('.selectpicker')? Pewnie robisz jakiś nieprawidłowy import, albo drobną literówkę.

[UrimTumim]

(samo odpalenie $('selectpicker') oczywiście działa)

@UrimTumim:

A jak importujesz jQuery? Co zwraca $('.selectpicker')? Pewnie robisz jakiś nieprawidłowy import, albo drobna literówka.

@lojawyk:
import $ from 'jquery'

[lojawyk]

To że odpalenie nie wywala błędów w js nic nie znaczy. Co zwraca? Spróbuj wrzucić zaraz za importem jQuery.

[UrimTumim]

@lojawyk: @lobo:
dzięki za pomoc prawdopodobnie błąd mam w innym miejscu, zrobiłem tak jak sugerował @lobo i spróbowałem to przenieść na sandboxa i o dziwo zadziałało ;o
jak macie sekundę i chcecie rzucić okiem

[RolnikSamWdolinie]

@UrimTumim: używasz jQuery we Vue. Bez komentarza

[UrimTumim]

@RolnikSamWdolinie: wiem, że jQuery to zło;p a jQuery w projekcje z Vue to zlo^2, zwłaszcza że od es6+ używanie jQuery zupełnie traci sens. Ale też nie będę przepisywał całej logiki napisanej przez kogoś innego w jQuery, żeby osadzić dwa komponenty. Bo zwyczajnie nie mam na to czasu;/

[RolnikSamWdolinie]

@UrimTumim: jquery to nie jest zło tylko nalezy go stosowac w innych miejscach niz we frameworkach bo mozes sobie namieszac latwo. Skoro korzystasz z vue to powinieneś poszukać tego elementu wrzuconego w komponent vue i korzystać z propsów/eventów/metod. Tak byłoby szybciej skoro nie masz czasu :) https://github.com/Sandalf/vue-bootstrap-select