泛微Ecode新增Button调用服务器中的JSP页面里的方法

前言

前端Ecode调用

后端接口编写

JSP文件方法

总结

前言

因为我们是从之前E8版本升级到E9的，所以会有一些接口是通过jsp文件来实现前后端调用的，这里介绍的就是如果你有接口是写在jsp文件里面调用的，但是你又想在Ecode中调用的对应的接口，那么继续往下看你就会明白具体该如何调用了

前端Ecode调用

const { WeaTools, WeaSlideModal } = ecCom;

class testComponent extends React.Component {
constructor(props) {
super(props);
this.state = {
info: {
name: ''
},
jsonData: {},
currentObj: {},
xm: WfForm.getFieldValue(WfForm.convertFieldNameToId("xm"))
};

}

componentDidMount() {
window.WfCustomInfoRef = this;
this.getData();
}

getData() {
const data = {
name: "John1",
age: 25
};

fetch('http://IP:PORT/api/workflow/test/getInfo2', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify(data)
})
.then(response => response.json())
.then(data => {
this.setState({
jsonData: data
}, () => {
console.log(this.state.jsonData);
console.log("输出姓名值" + this.state.xm);
});
})
.catch(error => {
console.error('请求出错:', error);
});
}

handleClick() {
alert("ecode方法被点击");

}

render() {
const { info, jsonData, currentObj } = this.state;
return (
<div>
添加的自定义内容2{jsonData.username}
<SonComponent />
<button onClick={()=>{
var requestId = WfForm.getBaseInfo().requestid;
jQuery.ajax({
type: "POST",
url: "http://IP:PORT/workflow/request/GetInfoDataAjax.jsp",
data: {'requestid':requestId, 'method':"QZgd"},
//dataType: 'json',
success:function(data){
console.log(data)
// alert(data)
},
error:function(data){
alert("系统出现问题，请联系管理员!");
}
})
}}>按钮</button>
{jsonData.test}
</div>
);
}
}

ecodeSDK.setCom('${appId}', 'testComponent', testComponent);

需要注意的是，可以直接在插入的按钮里编写点击事件，但是推荐最好就是定义一个方法，然后点击按钮的时候直接调用就可以了（因为我这里是做一个测试，所以就直接写上去了）

后端接口编写

package com.jiuyi.info;
import weaver.interfaces.workflow.action.WorkflowFnaInWorkflow;
import org.apache.commons.logging.Log;
import org.apache.commons.logging.LogFactory;

public class TestGuiDang {
private Log log = (Log) LogFactory.getLog(WorkflowFnaInWorkflow.class.getName());
public String Qzgd(String requestId){
this.log.info("TestGuiDang测试按钮点击接口的调用"+requestId);

return "1";
}

}

在这个class中编写你需要的代码即可，无论是更新数据还是返回信息都可以，只是你需要注意要将这个接口放到对应的jsp文件中引用

JSP文件方法

<%@page import="net.sf.json.JSONObject"%>
<%@ page language="java" contentType="text/html; charset=UTF-8" %>

<%@page import="weaver.general.Util"%>
<%@page import="com.sap.mw.jco.IFunctionTemplate"%>
<%@page import="com.sap.mw.jco.JCO"%>

<jsp:useBean id="rs" class="weaver.conn.RecordSet" scope="page"/>
<%@page import="weaver.general.BaseBean"%>

<%@page import="com.jiuyi.ajax.TestGuiDang"%>

<%

if(method.equals("QZgd")){
TestGuiDang testGuiDan = new TestGuiDang();
String requestId = Util.null2String(request.getParameter("requestid"));
out.println("Request ID: " + requestId);
out.println(testGuiDan.Qzgd(requestId));
return;
}

%>

在jsp文件中，你会有对应的方法名称来进行判断，然后只需要实例化对象然后传参调用即可

总结

建议最好还是直接采用E9的接口编写，那样的话轻松多了，可以直接通过接口传递参数而不用借助jsp文件来实现前后端的传参