立即体验
搭建开发环境 在进行开发之前,需要下载安装APICloud Studio3工具,通过Studio3新建和编写stml页面并预览调试,参考开发工具。
编写stml文件 stml(single template markup language)文件是一个专用的文件类型,其结构和Vue的单文件组件 (SFC)相似,用类Html语法描述一个组件/页面。更多关于stml可参考stml页面介绍。
在创建stml文件之前,我们需要在项目根目录下新建一个pages目录,只有放置在pages目录下的stml文件才会被正确编译。
打开APICloud Studio 3并导入项目,在项目结构的pages目录上点鼠标右键,在弹出的菜单中选择“新建stml文件”,然后输入文件名回车确认,这样就创建了一个默认的空白的stml页面,我们可以简单的添加一个text文本。
<template name='tpl'>
<view class="page">
<text>APICloud</text>
</view>
</template>
<script>
export default{
name: 'tpl',
apiready(){//like created
},
data() {
return{
}
},
methods: {
}
}
</script>
<style>
.page {
height: 100%;
}
</style>
预览stml文件 预览stml文件效果有以下三种方式:
- 实时预览 在stml页面编辑区内点鼠标右键,选择“实时预览”,将会启动Studio3的内置浏览器进行预览。
- WiFi真机实时预览 使用WiFi真机实时预览时,需要手机端安装AppLoader或者自定义loader,并在loader内连接Studio。在stml页面编辑区内点鼠标右键,选择“WiFi真机实时预览”,页面将会自动在已连接Studio的手机端loader里面显示。
- WiFi同步
通过WiFi同步将Studio里面代码同步到手机端loader里面,通过api.openWin、api.openFrame等方法打开stml页面进行预览:
api.openWin({ name: 'test', url: '../pages/test.stml', avm: true });