开发模式IDE
1、进入开发模式
一个页面由3个文件组件，分别是展现文件（w）、逻辑文件（js）和样式文件（css）。
一个服务是一个java文件，也是一个java类；一个请求是一个java方法。
如果需要修改以上这些文件，或者引入新的js、css、jar等文件，就需要进入开发模式进行操作。
进入开发模式有如下两种方法：
- 将导航栏中的开发模式开关设置为ON
- 切换到高级页，将开启源码编辑开关设置为打开
进入开发模式后，在页面设计器的下方会出现4个按钮，用于切换设计界面和源码界面。
- 设计：切换到页面的设计界面
- 源码：显示页面的w文件中的代码
- js： 显示页面的js文件中的代码
- css： 显示页面的css文件中的代码
进入开发模式后，在请求设计器的下方会出现3个按钮，用于切换设计界面和源码界面
- 设计：切换到请求的设计界面
- 源码：显示服务的描述文件中的代码（一般情况下，不需要编辑）
- java： 显示服务的java文件中的代码
进入开发模式后，导航栏中出现IDE标签。点击IDE标签进入源码编辑界面，如下图所示。
2、IDE资源目录介绍
（1）页面
页面制作区中的页面栏中的默认分组是model/UI2/main目录，默认分组下的页面都在这个目录下，如下图所示的index页面和main页面。新添加的分组在model/UI2/main目录下，例如添加“设置”分组，会在model/UI2/main目录下出现shezhi目录。
分组名称转换成目录和页面名称转换成文件的规则一样，即为前两个字转换成全拼，加下划线，后面的字转换成拼音首字母。例如：分组名为“个人设置”，转换后的目录名为“geren_sz”。
APP的主页和小程序的主页文件不同
- APP的主页是model/UI2/main/main.*
- 小程序的主页是model/UI2/main/index.*
APP还有一个首页文件，是model/UI2/main/index.w，里面包含门户组件，在这个文件中嵌入了APP的主页main.w。APP和小程序在预览时运行的都是model/UI2/main/index.w文件。因此APP刷新时必须点浏览器的刷新按钮，如果点主页，则会运行main.w文件，导致门户功能不能使用，例如打开新页面等功能。
（2）管理后台页面
APP的管理后台页面的默认分组是model/UI2/main/admin目录，添加页面和添加目录的规则中页面制作相同。其中DMPages目录是数据维护分组目录，下面的一个目录就是一个数据集。
小程序的管理后台页面的默认分组是model/UI2/main_admin/admin目录。里面内容和APP管理后台目录相同。
（3）服务
服务的目录是model/service，其中
- main目录是源码目录，我们编辑这个目录下的java文件
- bundle目录是编译生成的目录，我们不修改
添加的服务的文件位置，以“我的服务”为例说明如下
- “我的服务”的模型文件是main目录下的wodifw.service.m文件
- “我的服务”的java文件是main/src/main.java/main/service/WodifwUserService.java文件
- “我的服务”中的“我的请求”是WodifwUserService类中的wodiqq方法
3、开发js
（1）添加组件的事件
在事件操作中选择“代码”，如下图所示，然后点击跳转按钮。点击跳转是关键的一步，只有点击跳转才能生成js代码。
点击跳转按钮自动切换到js代码页，可看到新添加的组件的事件，可以在这里写js代码。如果要到IDE中编辑代码，此时必须点保存按钮。
在js文件保存后，切换到IDE，并打开这个页面的js文件，可以看到新添加的组件的事件。
（2）获取组件js对象
在js代码中如果要访问组件的属性或者调用组件的方法，就必须先获取组件的js对象。使用this.comp("组件的xid或id属性值")方法获取。
APP使用组件xid属性获取js对象。例如：this.comp("restData")获取商品数据集js对象。
小程序使用组件id属性获取js对象。例如：this.comp("restData")获取商品数据集js对象。
（3）调用组件的方法
以调用数据集组件提供的取值getValue方法为例，介绍在js文件中调用组件的方法。
getValue方法的第一个参数是数据集的列名，从数据制作区中数据集的结构定义中获得列名。
getValue方法的第二个参数，可以不写，不提供第二个参数，就意味着从当前行中取值。
从商品数据集的当前行中获取名称列的值的js代码，如下图所示。
（4）自定义函数及调用
APP和小程序中自定义函数的写法不同，原因是APP使用js语法，小程序使用es6语法。调用自定义函数的写法相同。
APP中自定义函数的写法如下图所示。
小程序中自定义函数的写法如下图所示。
（5）添加自定义js文件
APP中建议使用模块化js，支持符合AMD规范的js，下图即为符合AMD规范的js。
APP也支持普通js。
小程序中要使用es6语法
（6）调用自定义js文件
在APP中引用符合AMD规范的js和普通js的写法不同，调用其方法的代码也不同，引用及调用的写法如下图所示。注意引用时不写.js.
在小程序中引用及调用的写法如下图所示
（7）调用小程序API
在小程序中除了调用组件的方法，还可以调用API。
将小程序API示例代码直接复制即可使用。
4、开发css
（1）自定义css
在页面的css文件中可以自定义样式，如下图所示。
（2）使用自定义css
在组件的预定义样式属性中增加自定义样式，运行即可看到效果。
（3）添加自定义css文件
某个页面中用到的样式写在该页面的css文件中。而公共的样式一般定义在一个单独的css文件中。在需要使用这个css样式的页面中引用这个css文件来使用。
系统中model/UI2/main/common.css是全局公共样式文件，即在自定义样式属性中定义的全局样式都是写在这个文件中的，可以将自己的全局样式写在这个文件中，这个文件不需要引用，系统已经自动引用了。如果没有设置过自定义样式中的全局样式，这个文件默认不存在，可以在自定义样式中先添加一个全局样式，以便系统创建出这个文件。
（4）引用自定义css文件
APP中，在js文件中引用css文件，代码如下图所示。组件还是在预定义样式中设置css文件中定义的样式。
小程序里，在页面文件中引用css文件，代码如下图所示。组件还是在预定义样式中设置css文件中定义的样式。
5、开发java
（1）修改服务请求对应的java方法
服务是一个java类，请求是java类里面的一个方法。在服务制作区中，打开请求，切换到java页，即可看到请求对应的java方法。在java文件中直接修改，不会同步设计内容，因此，修改java文件后，不要再进入该请求的设计页面，否则会导致已修改的java文件内容丢失。
在IDE中也可以打开服务对应的java文件，修改请求对应的java方法。java文件在model/service/main/src/main/java/main/service目录下。
java方法的参数就是在请求中定义的参数。
（2）检查java编译是否成功
修改java文件后，点击保存按钮，系统会对java进行编译，编译成功后，发送请求就能看到修改java的效果了。
如果java有错误，会导致编译失败，编译失败的服务和请求前面会显示红色的叹号。
为了观察到java编译是否完成，可以在点击保存按钮前，打开浏览器开发人员工具的network页，然后点击保存按钮，观察compile.j这个请求的执行情况，这就是执行编译的请求，该请求完成说明编译完成。