Это руководство основано на Vue.js 2.x.
Автор: HelloGitHub-стремящийся к мечте
Добро пожаловать в HelloVue-todo-tutorial, этот учебник проведет вас через создание приложения Todo (to-do) с помощью Vue с нуля.
Этот учебник можно рассматривать как дополнительную часть серии HelloDjango.После ознакомления с основными концепциями Vue в этом руководстве мы будем использовать метод разделения внешнего и внутреннего интерфейса для разработки приложения для блога Django.
Этот учебник также является началом серии руководств HelloVue, которые шаг за шагом проведут вас по Vue и изучат все аспекты разработки Vue в реальном бою.
такой же,Этот учебник полностью бесплатный и с открытым исходным кодом, и впервые был опубликован в общедоступной учетной записи HelloGitHub.
Что такое Vue.js
Vue (произносится как /vjuː/, похоже на view) — это прогрессивный фреймворк для создания пользовательских интерфейсов. В отличие от других крупных фреймворков, Vue разработан так, чтобы его можно было применять слой за слоем снизу вверх. Основная библиотека Vue ориентирована только на уровень представления, который не только прост в использовании, но и легко интегрируется со сторонними библиотеками или существующими проектами. С другой стороны, в сочетании с современными наборами инструментов и различными вспомогательными библиотеками Vue также полностью способен работать со сложными одностраничными приложениями.
Он занимает третье место в общем списке с 174 000 звезд на GitHub. (Статистика на момент публикации статьи)
Если вы не понимаете вышеизложенного, просто прочитайте это предложение: Vue.js — одна из самых популярных интерфейсных сред с открытым исходным кодом. хорошая идея, чтобы узнать это.
Особенности этого учебника
Этот учебник полностью предназначен для начинающих, вы можете знать HTML немного, потратить более 10 минут на просмотр базового руководства по JavaScript или даже не знать, что такое CSS. Это не имеет значения!
Этот учебник не научит вас сначала настраивать сложные интерфейсные инженерные проекты (многие блоги, которые я собрал в Интернете, которые учат Vue разрабатывать приложения Todo, делают это), что может легко отпугнуть новичка. По сути, Vue — это просто библиотека JavaScript, нам нужно только подготовить текстовый редактор, способный вводить код, и современный браузер для запуска приложений Vue. Поэтому в этом руководстве мы отложим в сторону утомительный процесс инженерной настройки внешнего интерфейса, весь код будет написан в одном файле HTML, откройте его в браузере, чтобы просмотреть эффект, и нажмите F12 для отладки кода.
Конечный результат нашего проекта выглядит следующим образом:
Вы можете увидеть интерфейс приложения на уровне 80-х годов прошлого века, потому что мы используем нативный браузерный UI без добавления каких-либо стилей CSS. С этим стилем большое преимущество, так что мы можем полностью сосредоточиться на использовании Vue, а не на этих дополнительных элементах стиля. В конце концов, даже Google, Amazon и Facebook, а также многие другие известные компании также используют это приложение с очень упрощенным дизайном стиля, и основатель проса Лэй Цзюнь также сказал: «Ни один дизайн не является лучшим дизайном дизайна», объяснил, что этот дизайн все еще имеет заслуга в.
Конечно, легко добавить стили в наше приложение Vue Todo после использования некоторых фреймворков, таких как Boostrap и Materialize.Если вы создаете Todo с другим стилем, отправьте мне запрос на включение.
Использование приложения Todo для объяснения основных функций Vue очень уместно, потому что это маленький воробей, но у него есть все внутренние органы. Todo может включать почти все основные функции Vue, такие как вычисляемые свойства, прослушиватели, директивы, динамическая привязка стилей, условный рендеринг, рендеринг списка, обработка событий, привязка форм, компоненты, связь между компонентами и пользовательские директивы. Через пример todo, чтобы понять, что эти функции могут нам помочь, а затем, оглядываясь назад на относительно скучную официальную вводную документацию, мы определенно получим более глубокое понимание этих функций Vue.
Адрес открытого проекта:GitHub.com/привет GitHub…
Хорошо, давайте подготовим текстовый редактор и браузер и начнем!