vue używanie $refs

Hej, mam pytanie odnośnie używania $refs w vue, używam tego komponentu: https://github.com/ratiw/vuetable-2 i chciałbym teraz przeładować z nim dane po kliku tj:

<button @click="addNewElement()">Dodaj element</button>

....
#js:
addNewElement() {
let data = {
name: "test",
surname: "bla bla"
};
//dodajemy nowy element i chcemy mieć w tabelce świeże dane
this.$http.post("url", data).then(function() {
this.$refs.vuetable.loadData();
});
},

Czy robienie tego w ten sposób ma sens? Nie widzę innej możliwości przeładowania danych tego komponentu niż przez użycie $refs. Czy może sam pattern tego komponentu jest zły? Jeśli tak to jak zrobić to prawidłowo?

Właśnie cała frajda pisaniu frontu w Vue.js polega na tym, żeby tak tego nie robić :) W jaki sposób komponent ładuje dane? W dokumentacji widzę, że wczytują przez props api-url, w którym jest link do jakiegoś zewnętrznego jsona. Jeśli tak, to chyba nie ma możliwości zrobienia tego w sposób reaktywny, no bo skąd vue ma wiedzieć, że dane z tego urla się zmieniły.

Komponent powinien być zbindowany do obiektu zwracanego przez np. data albo computed. Wtedy robiąc posta ajaxowo możesz robić pusha na tym obiekcie, a wszelkie komponenty, które są do niego zbindowane powinny automatycznie odświeżyć widoki. Ja do tego używam vuexa.

PS. jeżeli nie możesz podpiąć danych reaktywnie, poszukaj informacji o vue event bus. W ten sposób będziesz mógł jednym eventem odświeżyć wiele komponentów, w przeciwieństwie do $refs, gdzie musiałbyś odnosić się do każdego z osobna.

@kkojot czy to co napisałeś oznacz, że ten komponent jest napisany nie tak? Ewentualnie czy dałoby się go przeprojektować, tak żeby było ok? Demo jego użycia tutaj: http://jsfiddle.net/9az1xo8q//z11fe07p/1318/ - generalnie przy zmianie sortowania, lub strony komponent wykonuje nowy request do serwera - dla moich potrzeb jest to ok - pracuję na bardzo dużym zbiorze danych i raczej nie widzę opcji zaczytania wszystkich danych na raz i filtrowania ich czy sortowania po stronie js-a. Być może komponent powinien być podzielony jakoś na dwie warstwy?

Poprawny link
https://jsfiddle.net/9az1xo8q/z11fe07p/

Niestety nie dam Ci gotowego rozwiązania, bo dzisiaj nie mam czasu bawić się tym komponentem, ale z pobieżnie przejrzanej dokumentacji zainteresowałbym się takimi propsami jak data, metodą setData tego komponentu oraz tableData.

Generalnie wygląda na to, że komponent wczytuje ajaxowo dane i zapisuje je sobie do tableData. Możesz tę wartość zmienić metodą setData. Więc po zrobieniu POSTu do serwera spróbuj dodać też wartość przez setData zamiast pobierać wszystko nowym requestem.