通过自定义代码控件，在审批表单的子列表中的每一行添加自动编号显示功能。这个特性将使用户能够轻松定位每一行的数据信息。
步骤1：添加一个子列表控件
从审批表单设计器中，向表单添加一个子列表控件。根据需要编辑子列表的字段ID和字段名称。例如下面，字段ID设置为"DetailsList"，字段名称设置为"Purchase Details List"：
然后，在列表内容设置组中，点击字段的“设置”按钮打开列表字段设置窗口。添加一个文本类型字段，将字段ID设置为"field_NO"，字段名称可以设置为"NO"。点击此字段的复选框并将排序号设置为"1"。这将确保这个字段将作为子列表的第一列显示。
接下来，展开NO字段设置面板，并将表视图的列宽设置为50px。
点击控件属性的“设置”按钮，打开文本框控件设置窗口。展开验证组，并开启只读设置。
步骤2：添加自定义代码控件
从高级组中找到“自定义代码”控件，拖动添加到您的表单上。
在内容设置面板中，将以下代码脚本粘贴到文本区域：
codeInModules=function(t){var e={};function r(n){if(e[n])return e[n].exports;var o=e[n]={i:n,l:!1,exports:{}};return t[n].call(o.exports,o,o.exports,r),o.l=!0,o.exports}return r.m=t,r.c=e,r.d=function(t,e,n){r.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:n})},r.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},r.t=function(t,e){if(1&e&&(t=r(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var n=Object.create(null);if(r.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var o in t)r.d(n,o,function(e){return t[e]}.bind(null,o));return n},r.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return r.d(e,"a",e),e},r.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},r.p="",r(r.s=15)}({0:function(t,e,r){"use strict";Object.defineProperty(e,"__esModule",{value:!0}),e.MODULE_COMMON="common",e.MODULE_REQUEST="request",e.MODULE_MOMENT="moment",e.MODULE_BIZCHARTS="bizcharts",e.TEMP_VAR_PREFIX="__temp_",e.FILTER_VAR_PREFIX="__filter_",e.LIST_ROW_DELETE="_del"},1:function(t,e){t.exports=React},15:function(t,e,r){"use strict";var n,o=this&&this.__extends||(n=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,e){t.__proto__=e}||function(t,e){for(var r in e)e.hasOwnProperty(r)&&(t[r]=e[r])},function(t,e){function r(){this.constructor=t}n(t,e),t.prototype=null===e?Object.create(e):(r.prototype=e.prototype,new r)}),i=this&&this.__read||function(t,e){var r="function"==typeof Symbol&&t[Symbol.iterator];if(!r)return t;var n,o,i=r.call(t),u=[];try{for(;(void 0===e||e-- >0)&&!(n=i.next()).done;)u.push(n.value)}catch(t){o={error:t}}finally{try{n&&!n.done&&(r=i.return)&&r.call(i)}finally{if(o)throw o.error}}return u},u=this&&this.__spread||function(){for(var t=[],e=0;e<arguments.length;e++)t=t.concat(i(arguments[e]));return t};Object.defineProperty(e,"__esModule",{value:!0});var c=r(1),a=r(0),s=function(){function t(){}return t.prototype.description=function(){return"Fill in sequence number in first column of a Sub List"},t.prototype.inputParameters=function(){return[{id:"listId",type:"string",desc:"Varaible ID of the Sub List, use to monitor the change of the list."},{id:"snField",type:"string",desc:"Field ID of Sub List to store sequence number."}]},t.prototype.requiredFields=function(t){return[t.listId]},t.prototype.render=function(t,e,r){return c.createElement(l,{data:e[t.params.listId],context:t,readonly:r})},t}();e.CodeInApplication=s;var l=function(t){function e(e,r){var n=t.call(this,e,r)||this;return console.log("Init addSeqNoToSubList..."),n.process(e),n}return o(e,t),e.prototype.process=function(t){var e=t.context,r=t.readonly,n=t.data;if(!r&&n&&n.length){var o=e.params,i=1,c=!1;n.forEach((function(t,r){t&&!t[a.LIST_ROW_DELETE]&&(e.setFieldValue(o.listId+"["+r+"]."+o.snField,i++),c=!0)})),c&&(this.cache=u(n),e.setFieldValue(o.listId,this.cache))}},e.prototype.componentWillReceiveProps=function(t){"data"in t&&t.data!==this.props.data&&t.data!==this.cache&&this.process(t)},e.prototype.render=function(){return null},e}(c.Component);e.ListChangeComp=l}});然后在下面的“输入参数”部分，设置listId和snField参数：
listId是关联子列表的字段ID，将值设置为"DetailsList"
snField是用于显示递增编号列的字段ID，将其设置为"field_NO"。
步骤3：预览和验证
设置完毕后，您可以点击表单设计器中的“预览”按钮来检查结果。当您添加新项目时，第一列将显示这一行的编号。
您可以发布它，使其对用户可用。