# 新建编辑页JS插件
新建编辑页JS插件包含以下扩展场景：
- 修改视图渲染：字段组件、弹窗显示
- 控制表单流程
# 修改视图渲染
该类需求需要通过以下API来实现：
# customFieldCom()
参数：
field: Object：字段描述信息
用法：
该钩子定义哪些字段需要被插件重新渲染。可以通过字段的api_name和字段类型进行判断。
示例：
config.json
{
"components":{
"customText": "components/customText/index"
},
"main":"plugins/testplugin.js"
}
plugins/testplugin.js
export default function (context) {
return {
customFieldCom(field) {
let compInfo = null;
if (field.name === 'name') {
compInfo = {
name: "customText",
prop: { test: 1, field },
}
}
return Promise.resolve(compInfo);
}
}
}
customFieldCom 返回的 组件name 与 config.json 声明的 组件 保持一致。
# renderFixedCom()
用法：
该钩子声明弹窗组件需要被替换。
示例：
export default function (context) {
return {
renderFixedCom() {
return [
{
name: "dialog1",
prop: { test: 1 },
}
];
}
}
}
name 与 config.json 保持一致。
# 控制表单流程
# renderEnd()
用法：
renderEnd发生在表单渲染之后
export default function (context) {
return {
renderEnd() {
console.log("test plugin: renderEnd");
wx.showModal({
content: "插件拦截renderEnd",
showCancel: false,
});
}
}
}
# beforeSubmit()
参数：
opt: Object：提交所需的数据
返回：
promise: Promise：promise的值为处理后的数据。
用法：
beforeSubmit发生表单提交之前。我们可以用来拦截请求或者修改请求。
export default function (context) {
return {
beforeSubmit(opt) {
console.log("test plugin: beforeSubmit");
return new Promise((resolve) => {
wx.showModal({
title: "插件拦截提交",
content: "是否提交？",
showCancel: true,
success(rst) {
if (rst.confirm) {
resolve(opt);
}
},
});
});
}
}
}
# submitted()
参数：
opt: Object：提交所需的数据
返回：
promise: Promise：promise的值为处理后的数据。
用法：
submitted发生表单提交成功之后，我们可以添加自己的一些ui行为。
export default function (context) {
return {
submitted(opt) {
console.log("test plugin: submitted");
return new Promise((resolve) => {
wx.showModal({
title: "插件拦截提交后动作",
content: "是否继续？",
showCancel: true,
success(rst) {
if (rst.confirm) {
resolve(opt);
}
},
});
});
}
}
}
# beforeNormalButtonsRender()
参数：
opt: Object：原始按钮等参数
返回：
promise: Promise：promise的值为处理后的按钮列表。
用法：
在这里过滤或追加按钮，或者注入onClick事件
export default function (context) {
return {
/**通用按钮处理*/
beforeNormalButtonsRender({buttons}) {
buttons&&buttons.some(it=>{
if(it.api_name==="button_testplugin__c"){
it.onClick=function (){
context.emitEvent("show-dialog1", {test:654987})
fsapi.jsapi.selectPOI({
})
}
return true;
}
})
return Promise.resolve(buttons)
},
}
}
# afterMdAddRow()
参数：
opt: Object：从对象信息等
返回：
promise: Promise：promise的值可以控制后续流程
用法：
添加一行从对象数据动作后触发
export default function (context) {
return {
/**添加一行从对象数据后，自动打开表单弹层，*/
afterMdAddRow({objApiName,//从对象apiName
}){
//autoOpenForm: 自动打开全部表单弹层
return Promise.resolve({autoOpenForm:true})
}
}
}
# getTitle()
参数：
opt: Object：原标题，是否编辑场景等信息
返回：
promise: Promise：返回调整后的标题
用法：
替换标题栏文字
export default function (context) {
return {
/**返回标题文字*/
getTitle({title,//默认标题
isEdit,//是否编辑场景
}){
return Promise.resolve({title:""})
}
}
}
# context
# getDescribe()
返回：
describe: Object：对象的描述信息api_name: String：对象的apiNamedisplay_name: String：对象的名称fields: Object：对象的所有字段
用法：
该方法返回当前对象的对象描述信息。
const describe = context.getDescribe();
console.log(describe.api_name);
console.log(describe.fields);
# getDetailDescribe()
参数：
detail_api_name: String：从对象的apiName
用法：
该方法返回从对象的对象描述信息。
const describe = context.getDetailDescribe('detail_api_name');
console.log(describe.api_name);
console.log(describe.fields);
# getAllDetailDescribes()
用法：
该方法返回所有从对象的对象描述信息。
const describes = context.getAllDetailDescribes();
describes.forEach(describe => {
console.log(describe);
})
# getData()
参数：
fieldApiName: String：字段的apiName（可选）
用法：
该方法返回主对象的数据。
const data = context.getData();
console.log(data.name);
console.log(data.owner);
const nameValue = context.getData('name');
console.log(nameValue);
# setData(changeData, opt)
参数：
changeData: Object：变更的数据opt: Object：字段的值opt.fieldName: String：触发变更的字段，ui事件触发需要，不传无法触发ui事件triggerUiFieldNames: Array：触发ui事件变化的字段，特殊场景需要triggerCal: Boolean：是否触发计算triggerUi: Boolean：是否触发ui事件noCalField: Array：指定不触发计算的字段
用法：
设置数据。
context.setData({"field_api_name": value}, {
fieldName: 'field_api_name'
});
# getDetailData()
参数：
apiName: String：对象的apiNamerecordType: String：对象的业务类型（可选）
返回：
固定apiName(固定业务类型)下的从对象数据
用法：
获取某个从对象某个业务类型的数据
let data = context.getDetailData('object_ad3xs__c');
let data1 = context.getDetailData('object_ad3xs__c', 'default__c');
# getAllDetailDatas()
返回：
获取所有从对象数据。
用法：
const data = context.getAllDetailDatas();
console.log(data);
# updateDetailDataByApiName(apiName, list)
参数：
apiName: String：对象的apiNamelist: Array：对象的全部数据，数据中record_type是必须的
用法：
更新某个从对象的全部数据，删除，新增，更新都可以，不触发计算和ui事件
context.updateDetailDataByApiName(apiName, [{}]);