Многотерминальное распространение и ограниченная энергия — ежедневный кошмар многих фронтенд-разработчиков.
uni-appследитьVue.jsСпецификации синтаксиса, набор кодов, многотерминальное распространение эффективно решают болевые точки многих разработчиков;
Поэтому с момента его выпуска в августе десятки тысяч разработчиков воспользовалисьuni-app, на данный момент созданы десятки тысяч приложений, а активные разработчики ежедневно генерируют десятки тысяч записей общения в группе QQ.
Темп бега не остановит, на полировку ушло больше месяца,uni-appВерсия 1.2 официально выпущена и поддерживает распространение на платформе H5.
Слишком далеко,uni-appРеализовано iOS, Android, апплет, H5Основной четырехтерминальныйПолное покрытие!
Кроме того,uni-appНачиная с версии 1.2 он официально открыт (портал), добро пожаловать в пометку для поощрения.
Опыт сканирования кода
Чтобы привести пример, отсканируйте следующие 4 QR-кода по очереди, чтобы сравнить и испытать:
Примечание. Appstore не может отправлять простые демоверсии, поэтому в версии для iOS добавлены некоторые другие функции.
Начать быстро
uni-appподдержка черезHBuilderXвизуальный интерфейс,vue-cliЕсть два способа быстро создать проект из командной строки.После запуска на платформу H5 оба режима поддерживают горячую перезагрузку.
Визуальный интерфейс через HBuilderX
Метод визуализации относительно прост, HBuilderX имеет встроенную обработку соответствующих зависимостей среды, которая подходит для работы ленивым людям.
1. Загрузите HBuilderX (адрес), и установить, запустить
2. Создайте новый проект, выберитеuni-appвведите и выберитеHello uni-appшаблон
3. Нажмите на верхнее меню, чтобы запустить браузер Chrome.
4. После этого HBuilderX начинает компилироваться и выводит информацию в консоль
Tips:
- Если хром был открыт заранее, разработчику необходимо вручную переключить хром в режим отладки мобильного телефона.
- Если хром не открыт, HBuilderX попытается автоматически переключить хром в режим отладки, но это переключение происходит с задержкой, если страница отображается некорректно, ее нужно обновить вручную
Через командную строку vue-cli
ПривычкаcliСтуденты по лесам могут пройтиvue-cliСоздайтеuni-appпроект.
1. Установите vue-cli глобально
npm install -g @vue/cli
2. Создайте проект с единым приложением
vue create -p dcloudio/uni-preset-vue my-project
На этом этапе вам будет предложено выбрать шаблон проекта, и рекомендуется выбрать первый опыт.hello uni-appШаблон проекта, как показано ниже:
3. Войдите в каталог и запустите
cd my-project
npm run serve
После успешного завершения операции консоль выведет адрес доступа к веб-сайту H5 следующим образом:
4. Запустите браузер Chromel и переключитесь в режим отладки мобильного телефона, посетите указанный выше адрес, чтобы испытать его.
Советы:
- В настоящее время
cliScaffolding поддерживает компиляцию только для веб-сайта H5, следующая версия будет поддерживать компиляцию для платформы апплета WeChat; - Если вы хотите запустить апплет или приложение WeChat на этом этапе, вам нужно изменить корневой каталог проекта на
srcПапка, перетащите ее в HBuilderX, нажмите меню «Выполнить», чтобы выполнить
Боковая конфигурация H5
uni-appПри выпуске на стороне H5 принимается режим SPA и поддерживаются следующие конфигурации:
- Индивидуальные шаблоны страниц, поддержка простой настройки SEO и статистики Baidu.
- Поддержка хэш/история двух режимов перехода маршрутизации
- Поддержка компонентов загрузки пользовательских страниц js
Другие обновления в этом выпуске
uni-appВерсия 1.2 также включает следующие обновления:
- Добавлена условная компиляция #ifndef представляет условную компиляцию для платформы, отличной от этой (например, представляет платформу, отличную от H5, то есть платформу приложения и апплета, поддерживаемую в настоящее время uni-app)
- Добавлена поддержка tabBar API для установки красных точек и угловых меток.
- Добавлен API для мониторинга изменений состояния сети.
- Добавлено свойство открытого типа компонента кнопки для поддержки диапазона обратной связи.
- Добавлен файл manifest.json для настройки узла navigationToMiniProgramAppIdList, который может настроить список мини-программ, к которым нужно перейти.
- Добавлена поддержка nvue для сторонней библиотеки weex ui.
- Добавлена поддержка nvue для bindx.
- Добавлена поддержка nvue в событии NavigationBarButtonTap для верхней встроенной навигации.
- Исправлена проблема, из-за которой информация о параметрах терялась, когда метод uni.request был PUT или DELETE.
- Устранить проблему, из-за которой событие отмены компонента средства выбора не запускается.
- Исправлена проблема ненормального рендеринга данных компонентов в сложных сценах.
- Исправлена проблема, из-за которой параметры destWidth и destHeight, заданные методом uni.canvasToTempFilePath, не вступали в силу.
- Исправлена проблема с отсутствием хранилища при инициализации nvue.
- Устранена проблема, связанная с тем, что платформа nvue Android не поддерживает функцию Websocket.
- Устранена проблема, из-за которой страница платформы Android nvue может отображаться неправильно, если не установлен titleNView.
- Исправлена проблема, из-за которой убранная область могла быть неправильной после появления программной клавиатуры на платформе nvue iOS.
- Исправлена проблема, из-за которой данные не могли быть установлены при использовании uni.request на платформе nvue iOS.
- Оптимизируйте компонент веб-просмотра и увеличьте индикатор загрузки страницы.
- Оптимизация заголовка компонента веб-представления и синхронизации заголовка страницы
- Оптимизируйте тип компонента ввода = "число" для поддержки ввода десятичных точек на стороне приложения.
План на будущее
uni-appОн будет продолжать поддерживать высокоскоростную итерацию и дополнять совместимость апплета Baidu и Alipay, продолжая улучшать четыре покрытых терминала.
Дополнительные планы спроса см.Стена спроса в едином приложении