В настоящее время будет представлено множество вариантов интерфейсных фреймворков, React JS, AngularJS и Vue.js! Vue.js Некоторые люди говорят, что это похоже на React, другие говорят, что это похоже на AngularJS, Vue.js в основном представляет собой часть представления и модели, но его производительность, скорость и порог обучения ниже. так что начать работу с javascript несложно.

Основное преимущество Vue.js заключается в том, что он в основном ориентирован на веб-технологии, поддерживает html-шаблоны, jade и coffeescript и даже интегрируется с расширенными CSS, такими как sass и другие. Плагин расширенного характера - это тоже довольно много, друзья по технологическим разработкам, его действительно стоит изучить, в конце концов, в отличие от React, AngularJS фокусируется на кроссплатформенности, кросс-платформенности, что приводит к многому, что нужно изучить, или много нового концепции архитектуры, которые нужно изучить, конечно, Vue.js также ошибочен, он слишком сфокусирован на Интернете, другие платформы не могут использовать его должным образом, но, наоборот, если вы в основном веб-разработка, то вы ничем не хуже , и Vue. js можно сказать, что простая версия AngularJS, когда вы учитесь Vue.js, переходите к AngularJs, а это позволяет вам учиться быстро, волшебно! Поторопитесь и узнайте, как использовать Vue.js!

Внимательно посмотрите на файл официального веб-сайта. Вы найдете множество способов установки, на которые можно посмотреть, это кажется очень сложным, на самом деле, не сложно, как вы загрузили jquery:

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/1.0.26/vue.min.js"></script>

Пока есть строка выше в html-файле, есть ли что-нибудь простое? Конечно, вы должны скачать каталог с веб-сайта, это хороший выбор!

Давайте начнем с Hello World!

Первый шаг, очень простой, - создать пустую HTML-страницу. Второй шаг - представить Vue.js и создать div с именем id для приложения.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Hello World</title>
</head>
<body>

</body>
</html>

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>0 Hello World</title>
</head>
<body>

<div id="app">

</div>

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.0.1/vue.min.js"></script>
</body>
</html>
Третий шаг, создание Vue реализации функции, написанной в приложении div # Hello World! Конец! Супер простого не бывает! Не понимают? Нет проблем, позвольте мне немного пояснить. В приложении div # вы увидите что-то вроде {{message}}. Если вы уже изучали Smarty (шаблонный движок PHP), он может показаться вам немного знакомым. Если вы не изучили Smarty Это не имеет значения, jade также {} что-то, попросту {{}}, должно помочь вам перенести параметры в эту позицию, а в новом Vue внутри я указываю идентификатор элемента приложения (обычно превратились в элементы) В параметре сообщения и сообщении я здесь указываю значение по умолчанию Hello World !, Вышеупомянутая модель для записи Hello world, не очень проста!
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>0 Hello World</title>
</head>
<body>

<div id="app">
{{ message }}
</div>

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.0.1/vue.min.js"></script>
<script>
new Vue({
el:'#app',
data:{
message:'Hello World!'
}
});
</script>
</body>
</html>