強力なairoot-uisysv1バージョン-基本概念（1）

AIroot UISYS

www.airoot.cn

強力なWebUIツールであるため、これをuisysと呼びます
。強力なWeb UI開発ツールであるため、UISYSと呼びます。

例

<@pub/>
<!-- 定义一个模块 -->
<@define name="MyBox">
  <div>Hello Baby!</div>
</@define>

<!-- 你要展现的代码写在下面. -->
<div>
  <MyBox/>
  <MyBox/>
</div>

それはどのように機能しますか？

1. uisysツールを使用する必要があります。ダウンロードするにはここをクリックしてください
2. 次に、上記のファイルをD：\ test \ index.uiに保存します
3. 最後に、uisys.exeを実行し、uisysコマンドラインに次のコマンドを入力します。

pub D:\test\ :90

完璧です。ChromeまたはFirefoxブラウザを開き、http：// localhost：90 /index.uiと入力します。

このとき、ブラウザに2行の「HelloBaby！」というテキストが表示されます。

その他の例

次のようにJavaScriptを使用して作成することもできます。

<@pub/>
<!-- 定义一个模块 -->
<@define name="MyBox">
  <div>Hello Baby!</div>
</@define>

<!-- 你要展现的代码写在下面. -->
<div>
  <!-- dom 内部区域-->
</div>
<script>
  function init(){
     
     
    var box = new MyBox();
    dom.appendChild(box);
  }
</script>

または、次のように書くことができます。

<@pub/>
<!-- 定义一个模块 -->
<@define name="MyBox">
  <div>Hello Baby!</div>
</@define>

<!-- 你要展现的代码写在下面. -->
<div id="ct"></div>
<script>
  function init(){
     
     
    var box = new MyBox();
    #ct.appendChild(box);
  }
</script>

MyBoxモジュールをファイルとして保存する場合は、次のように単独で使用します。

MyBox.uiファイルを作成します。コードは次のとおりです。

<!-- MyBox 模块代码放在 D:\test\MyBox.ui -->
<div>Hello Baby!</div>

次のようにファイルIndex.uiコードを作成します。

<!-- Index 模块代码放在 D:\test\Index.ui -->
<@pub/>
<div>
  <MyBox/>
  <MyBox/>
</div>

ブラウザを開いて結果を表示し
ますが、「HelloBaby！」という2行のテキストが表示されます。

パッケージのアイデアを使用する

ファイルをフォルダーに入れたい場合は、次のようにします。

たとえば、D：\ test \ MyBox.uiをD：\ test \ mymod \ mybox.uiに移動します。

次に、インポートMyBox.uiにモジュールをIndex.uiのモジュール、あなたはIndex.uiのコードを変更する必要があります。

<!-- Index 模块代码放在 D:\test\Index.ui -->
<@pub/>
<div>
  <mymod.MyBox/>
  <mymod.MyBox/>
</div>

または、MyBox.uiをグローバルにインポートできます。

<!-- Index 模块代码放在 D:\test\Index.ui -->
<@pub/>
<@import value="mymod.MyBox" />
<div>
  <MyBox/>
  <MyBox/>
</div>

ブラウザを開いて結果を表示し
ますが、「HelloBaby！」という2行のテキストが表示されます。