VueJs - czy dobrze rozumiem zasade działania?

Zaczynam uczyć się VueJs i mam kilka pytan. Zakładając, że mam taki kod:

<script src="https://unpkg.com/vue/dist/vue.js"></script>

<div id="app">
  <p>
  {{ sayHello() }}
  </p>
</div>

new Vue({
	el: '#app',
  data: {
  	title: 'Hello World'
  },
  methods: {
  	sayHello: function() {
    	return 'Hello!';
    }
  }
});

1. Czy dobrze to rozumiem, że najpierw do obiektu Vue jest przekazywany wstępny html i na tej podstawie Vue tworzy template i go renderuje, a następnie nowy html jest renderowany przez przeglądarkę i w niej wyświetlany?
2. Czy w vuejs bez problemu można używać składni ecmascript? Np. Arrow functions

1.) vue pod spodem uzywa vdom jak react wiec po prostu albo sobie parsuje twoj html i przetwaza go do render function albo mozesz to zrobic w trakcie "kompilacji" i wtedy wiadomo ze bedzie dzialac szybciej cos jak JIT/AOT w angular https://vuejs.org/v2/guide/render-function.html#Template-Compilation
2.) vue mozesz uzywac z es5/es6/typescript wiec tak mozesz tez uzywac arrow functions

marcio napisał(a):

1.) vue pod spodem uzywa vdom jak react wiec po prostu albo sobie parsuje twoj html i przetwaza go do render function albo mozesz to zrobic w trakcie "kompilacji" i wtedy wiadomo ze bedzie dzialac szybciej cos jak JIT/AOT w angular https://vuejs.org/v2/guide/render-function.html#Template-Compilation
2.) vue mozesz uzywac z es5/es6/typescript wiec tak mozesz tez uzywac arrow functions

Czyli po przetworzeniu kodu w render function jest zwracany kod html, który już wyświetlany jest w przeglądarce?

no powiedzmy ze tak w miejsce tego id="app":

<div id="app">
  <p>
  {{ sayHello() }}
  </p>
</div>

Bedzie tam html razem z bindingami itp...itd...

Jeszcze mam jedno pytanie, jeśli mam taki kod:

<script src="https://unpkg.com/vue/dist/vue.js"></script>

<div id="app">
  <p>
  {{ sayHello() }}
  </p>
</div>

new Vue({
    el: '#app',
  data: {
    title: 'Hello World'
  },
  methods: {
    sayHello: function() {
        return this.title;
    }
  }
});

To czemu w returnie jest this.title, a nie this.data.title?

konewka85 napisał(a):

Jeszcze mam jedno pytanie, jeśli mam taki kod:

Kopiuj

<script src="https://unpkg.com/vue/dist/vue.js"></script>

<div id="app">
  <p>
  {{ sayHello() }}
  </p>
</div>

Kopiuj

new Vue({
    el: '#app',
  data: {
    title: 'Hello World'
  },
  methods: {
    sayHello: function() {
        return this.title;
    }
  }
});

To czemu w returnie jest this.title, a nie this.data.title?

Jest this ponieważ odnosisz się do danych spoza aktualnego zasięgu. Jak wspomniał kolega wyżej, poczytaj docsy.