Develop custom plug-ins

A custom plugin is a JavaScript script that can be configured in both forms and lists in the platform of Fangaku, so we will give an example to introduce its use.

Form js plugin

Suppose a scenario where we want to control the data when a form is submitted. The specific steps are as follows:

Step 1: Let's write the simplest form plugin, filename: formPlugin.js, the code is as follows:

export default {

   beforeSubmit: function(context, postData) {
       alert('插件已生效');
       return new Promise(resolve => {
           postData.name = '新值';
           postData['field_xg2az__c'] = '新值';
           resolve(postData)
       });
   }

}

Step 2: Find the "Custom Plugin" management interface in the admin background, click "New" and upload the file

When creating a new plug-in, select Component Type as . 新建编辑页JS插件

Step 3: In the form layout designer, find "New Edit Page JS Plug-in on PC" in "Global Settings", select the newly created plug-in just now, and save it

Step 4: In the front-end interface, when submitting data, you can see that the plug-in has taken effect

For more details, see New Edit Page Custom Plugin

List js plugins

Suppose such a scenario, we want to modify the state of the list. The specific steps are as follows:

Step 1: Let's write the simplest list plugin, filename: listPlugin.js, the code is as follows:

export default {

   beforeRender(context, options) {
       options.title = '表格新标题';
       options.noDataTip = '表格新无数据提示';
       return options;
   }

}

Step 2: Find the "Custom Plugin" management interface in the admin background, click "New" and upload the file

When creating a new plug-in, select Component Type as . 列表页JS插件

Step 3: In the list page layout designer, find "PC List Page JS Plugin" in "Global Settings", select the newly created plugin just now, and save it

Step 4: In the front-end interface, when submitting data, you can see that the plug-in has taken effect

For more details, see the list page Custom plugins;