外观
开发工具
约 1391 字大约 5 分钟
2025-02-12
氚云开发为在线开发，您无需安装任何开发环境与IDE，在线上编写的代码，点击保存之后，会直接生效到线上环境。
提示
对于新手开发者，建议单独建一个测试应用，用于代码测试，以防影响线上应用。
代码编辑器
氚云一共有4个代码编辑器界面，分别是：表单设计页面的前端代码、后端代码，列表设计页面的前端代码、后端代码。前端代码中统一使用 JavaScript 语言开发，后端代码中统一使用 C# 语言开发。
不清楚代码该写哪里，就看代码执行的时机是在表单页面中，还是在列表页面中。表单设计页中编写表单页面相关的逻辑代码，列表设计页中编写列表页面相关的逻辑代码。例如：
- 表单打开时、点击表单提交按钮、点击表单删除按钮、流程事件 的代码写表单设计页里
- 列表打开时、点击列表删除按钮 的代码写列表设计页里
注意：
由于是在线的编辑器，会受限于网络、浏览器等因素，对于代码中关键字和语法的识别不是特别准确，此问题需要慢慢适应
后端代码编辑器出现误报，可以尝试先保存代码，若保存成功，说明代码语法无误，随后刷新页面语法就能被识别
前端代码编辑器出现误报，只能保存后，在浏览器的开发者工具中才能确认代码是否正确
编辑器基本功能
- 格式化代码
在表单设计/列表设计页面，后端代码和前端代码都可以进行代码格式化，提升代码可读性
同时排除一些影响编译的字符，建议每次编写完代码后都格式化一次代码。
在后端代码/前端代码页面，鼠标右键，点击
Format Code在后端代码/前端代码页面，使用快捷键
Shift + Alt + F
- 代码搜索
在后端代码/前端代码页面，鼠标右键，点击
Find在后端代码/前端代码页面，使用快捷键
Ctrl + F
- 替换代码
- 使用快捷键
Ctrl + H
代码调试器
列表、表单后端代码调试
列表或表单的后端代码调试，都是先在列表界面中，按F12调出代码调试工具（若一直按无反应，可以刷新页面后重试）
后端调试器启动完成后，会自动进入调试模式并开始执行代码
调试表单后端代码时，点击列表上的数据标题打开表单数据查看页，或者点击新增按钮打开表单数据新增页，此时调试器会自动由列表代码调试转换为表单代码调试
Mac 电脑通过 fn + 相应的功能键，例如
fn + F12来打开调试工具在调试过程中，右侧的监视窗口会自动输出相关变量值，为变量跟踪、代码调试提供支持（注意：只有显式定义变量才会出现在监视窗口）
注意
如果后端调试器在启动时，会检验用户编写的代码，如编辑器内未编写任何代码，或者仅有默认代码，后端调试器将会不进入调试模式。
后端代码调试快捷键：
F10 逐过程执行
F11 逐句执行单步调试
F9 加入/取消断点
列表、表单前端代码调试
氚云使用的是浏览器自带的开发者工具进行前端代码的调试，在调试之前，需要在前端代码里单独一行加入debugger标记。例：
//表单设计前端代码
$.extend($.JForm,{
// 加载事件
OnLoad:function(){
//单独一行加入此标记
debugger
/**********以下代码为业务代码示例，此示例只需关注上面这个 debugger 这个标记如何添加**********/
//由于会在回调函数里用到this，而回调函数内直接用this会导致指向错误，所以要在此处先用一个变量存储
var that = this;
//设置一个文本框控件值为 test
that.F0000001.SetValue("test");
},
// 按钮事件
OnLoadActions:function(actions){
},
// 提交校验
OnValidate:function(actionControl){
//单独一行加入此标记
debugger
return true;
},
// 提交前事件
BeforeSubmit:function(action, postValue){
//单独一行加入此标记
debugger
},
// 提交后事件
AfterSubmit:function(action, responseValue){
//单独一行加入此标记
debugger
}
});//列表设计前端代码
$.ListView.ActionPreDo = function( actionCode ) {
if( actionCode == "按钮编码" ) {
//单独一行加入此标记
debugger
}
};加完 debugger 标记之后，回到列表页面 --> 刷新页面 --> 通过快捷键 **Ctrl + Shift + I** 调出开发者工具。
当js引擎执行到debugger标记处，就会自动跳到代码块。
提示
debugger 标记可以直接加在任意要调试的代码前一行，不是一定要加在事件首句。