Изображение демонстрирует

Это потрясающий проект.

Потрясающий он или нет, почувствуйте поэзию и изящество в каждой строке кода.

Мы — одухотворённые программисты, поэтому наш код наполнен поэзией.

Эх, действительно, больше не могу писать код.

[Каковы различия между основными открытыми исходными протоколами? (https://www.zhihu.com/question/19568896?sort=created)]

Как использовать (традиционный способ) командную строку для загрузки изменённого кода в облако кода?

1. git add .
2. git commit -m "информация о фиксации"
3. git push

Создание компонента главной страницы приложения

1. Завершите область заголовка, используя компонент Header из Mint-UI.
2. Создайте нижнюю область Tabbar, используя Tabbar.html из MUI.

• При создании значка корзины покупок процесс будет несколько более сложным:
• Скопируйте стиль CSS значка расширения в проект.
• Скопируйте файлы шрифтов расширения ttf в проект.
• Добавьте следующий стиль к значку корзины покупок: mui-icon mui-icon-extra mui-icon-extra-cart.

3. Поместите router-view в среднюю область для отображения компонентов, соответствующих маршруту.

Преобразование tabbar в router-link

Настройка подсветки маршрута

При нажатии на ссылку маршрута в tabbar отображается соответствующий компонент маршрута

Создание макета карусели домашней страницы

Загрузка данных карусели домашней страницы

1. Получение данных: как это сделать? Используйте vue-resource.
2. Используйте this.$http.get из vue-resource для получения данных.
3. Полученные данные необходимо сохранить в data.
4. Используйте v-for для рендеринга каждого элемента item.

Изменение макета девяти сеток на главной странице на шесть сеток (используя девять сеток из фреймворка MUI)

1. Установите макет шести сеток.
2. Замените стандартные значки шрифтов девяти сеток пользовательскими изображениями.

3. ---

Реализация переключения контента с анимационным эффектом

Реконструкция ссылки маршрута блока новостей и информации (завершение всего блока новостей и информации в девяти сетках)

1. Создание страницы NewList (использование MUI для создания всей страницы NewList), получение данных с сервера и отображение их на странице NewList.
2. Страница NewInfo (страница сведений о новостях) в NewList завершена, включая создание страницы, рендеринг данных с сервера, функцию комментариев пользователей.

Реконструкция ссылки маршрута блока обмена фотографиями (завершение всего блока обмена фотографиями)

1. Страница PhotoList (список фотографий) использует структуру MUI для построения всей страницы. Вкладка представляет собой данные, полученные с сервера (подсказка: впереди есть яма, большая яма (похоже, что фреймворк не так дружелюбен, всевозможные ямы... Если у вас есть возможность, вы можете попробовать написать его самостоятельно, в конце концов, это также большое улучшение ваших способностей, давайте продолжим)).
   • Заголовок использует вкладку для переключения (tab-top-webview-main.html), хорошо. Первая яма всё ещё впереди... (подсказка: при использовании вкладки для переключения нам нужно импортировать библиотеку js mui (здесь после импорта библиотеки js mui также необходимо настроить соответствующие компоненты для использования, см. официальный сайт), ладно... Некоторые студенты могут быть ошеломлены, они не могут не жаловаться в своём сердце, чёрт возьми, XX, это какой LZ (на самом деле я не думал о том, чтобы обновить свежие слова...)).
   • Подсказка 1 (официальная версия): при переключении вкладок в HTML-теге появится класс mui-fullscreen, который означает использование полноэкранного режима (по сути, позиционирование), в зависимости от ситуации, решите, следует ли отменить этот класс, обычно это не занимает весь экран (за исключением особых случаев).
   • Подсказка 2: некоторые студенты, возможно, уже обнаружили, что когда мы уже использовали предоставленный mui переключатель вкладок, мы также использовали библиотеку mui.js, но почему мы всё равно не можем переключаться между вкладками (только при повторной загрузке страницы)? На самом деле, здесь есть проблема, на самом деле, если вы немного внимательнее, вы поймёте, что когда мы переключаемся между вкладками, мы выполняем операцию DOM, поэтому нам нужно настроить компонент в функции mounted() (даже если мы настроим его в mounted(), хотя мы реализовали не нужно перезагружать страницу каждый раз, когда мы заходим, но также существует необходимость перезагрузки один раз, эта проблема пока не решена LZ, и она будет продолжать обновляться позже).
   • Подсказка 3: когда переключение вкладок становится возможным, щелчок по вкладке не действует. Это действительно трудно решить. На самом деле LZ был действительно ошеломлён в то время. На самом деле это не имеет никакого отношения к нам. Причина в том, что при переключении вкладок с помощью mui внутренние теги и Tabbar конфликтуют. Решение: переименуйте класс Tabbar и скопируйте исходный стиль Tabbar в наш код, а затем установите стиль в соответствии с нашим именем.
2. Получите список фотографий с сервера и используйте задержку загрузки mint-ui, при использовании задержки загрузки есть подсказка: нельзя отобразить значок задержки загрузки... LZ не может не сказать одну фразу, эх... Всё равно забудь об этом! Кто сказал, что мы просто слабый программист? Из-за внутренних причин mint-ui мы не можем использовать импорт компонентов по требованию, нам нужно использовать глобальный импорт, и проблема решена.
3. PhototInfo (подробная страница фотографии), используйте плагин vue-preview для отображения эскизов, остальное — получение данных с сервера и рендеринг, компонент комментария мы упаковали ранее, просто вызовите компонент напрямую.

Завершение функций модуля «Отметка времени», «Покупка товара» (включая список товаров и подробную страницу товара)

1. Добавление товаров в корзину, создание страниц со списком товаров и подробной информацией о товарах.
2. Сохраните данные корзины покупок в локальном хранилище с помощью localStorage.
3. Создайте и отобразите данные корзины покупок на странице корзины покупок, измените и удалите товары в корзине покупок.

Хорошо. Проект в основном завершён (кроме некоторых мелких деталей и модулей членства и поиска), время: 45 дней.