В чем разница между этими двумя способами передачи данных в компонент?

Question

[tantumus21]

В базовом проекте Vue, который создается автоматически, можно увидеть такую строчку
<HelloWorld msg="Welcome to Your Vue.js App"/>
Но в туториалах я ни разу не видел, чтобы в компонент передавали данные таким способом. Только через v-bind.
Насколько я понимаю, таким способом -> msg="Welcome" в переменную msg просто передается строка. А v-bind нужен для того, чтобы поместить значение переменной родителя в переменную, которая используется дочерним компонентом. Так?

Comments

[Сергей delphinpro]

Так?

Так.

Answer 1

[FinGanapre]

Чтобы что-то передать в дочерний компонент из родителя через пропсы всегда можно байндить.
Есть сокращённый синтаксис:
:msg="'Welcome to Your Vue.js App'"
и полный:
v-bind:msg="'Welcome to Your Vue.js App'"
В кавычках всегда js выражение, т.е. чтобы передать строку, нужно поставить ещё кавычки. Просто понимайте, что в кавычках у вас обычный js.
Но можно обойтись и без bind, но такое редко можно встретить, т.к. чаще всего в компонент передаётся переменная. Вот туториал, на который следует ориентироваться