onsen-uiНачало работы с onsen-ui


замечания

В этом разделе представлен обзор того, что такое onsen-ui, и почему разработчик может захотеть его использовать.

Следует также упомянуть любые крупные темы в onens-ui и ссылки на связанные темы. Поскольку документация для onsen-ui является новой, вам может потребоваться создать начальные версии этих связанных тем.

Вступление

Onsen UI - это платформа с открытым исходным кодом, которая помогает вам создавать гибридные приложения с такой же производительностью. Он может использоваться вместе с несколькими известными фреймворками JavaScript, такими как AngularJS (1 и 2), ReactJS и jQuery.

Загрузка OnsenUI в проекте так же просто, как запись некоторых стандартных тегов HTML в файл index.html:

<!doctype html>
    <html lang="en">
      <head>
        <meta charset="utf-8">
        <!-- load Onsen structure CSS file -->
        <link rel="stylesheet" href="lib/onsen/css/onsenui.css"/>
        <!-- load Onsen theme CSS file -->
        <link rel="stylesheet" href="lib/onsen/css/onsen-css-components.css"/>
        <!-- load Onsen main Javascript file -->
        <script src="lib/onsen/js/onsenui.js"></script>
        <script>
          ons.ready(function() {
            // Init code here
          });
        </script>
      </head>
      <body>
        <ons-navigator>
          <ons-page>
            Hello World!
          </ons-page>
        </ons-navigator>
      </body>
    </html>
 

Функция ons.ready является основной функцией, которая может с уверенностью сказать нам, когда инициализируется инициализация пользовательского интерфейса Onsen. Затем вы можете использовать любой из компонентов OnsenUI.