通过GWT JSNI传递Java对象时出错
Error when passing Java object through GWT JSNI
我有一个GWT项目，它使用GoogleJavaScriptChartneneneba API来显示Java对象的图表。我将Java对象转换为JSON，并通过JSNI将它们交给JavaScript图表API，这非常有效。
但现在我想更进一步，走另一条路：当我点击图表（我可以通过JavaScript监听器检测到）时，我想把那个Java对象发送回我的Java代码。
我想我已经完成了JSNI指南中的所有内容，但当我点击图表时，我在JavaScript控制台中收到了一个错误，我甚至不知道如何阅读：
SCRIPT5022: Exception thrown and not caught
File: eval code (21), Line: 5, Column: 7
__gwt_javaInvokes[2] =
function(thisObj, dispId,p0,p1) {
var result = __static(dispId, thisObj,p0,p1);
if (result[0]) {
throw result[1];
} else {
return result[1];
}
} function(thisObj, dispId,p0,p1) { var result = __static(dispId, thisObj,p0,p1); if (result[0]) { throw result[1]; } else { return result[1]; } }
这是我的html页面：
<!doctype html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<link type="text/css" rel="stylesheet" href="GwtTest.css">
<title>GWT Test</title>
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript" language="javascript" src="gwttest/gwttest.nocache.js"></script>
</head>
<body>
</body>
</html>
唯一感兴趣的是我添加了GoogleChartneneneba API脚本标记。
这是我试图从Java传递到JavaScript，然后再传递回Java的Java对象：
package com.example.client;
public class ChartData {
public String title = "test";
public String labelOne = "thingOne";
public String labelTwo = "thingTwo";
public String labelThree = "thingThree";
public int valueOne = 100;
public int valueTwo = 200;
public int valueThree = 300;
}
最后，这里是我的GWT客户端类：
package com.example.client;
import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.core.client.JsArray;
import com.google.gwt.core.client.JsonUtils;
import com.google.gwt.event.dom.client.ClickEvent;
import com.google.gwt.event.dom.client.ClickHandler;
import com.google.gwt.user.client.ui.Button;
import com.google.gwt.user.client.ui.RootLayoutPanel;
import com.google.gwt.user.client.ui.SimplePanel;
import com.google.gwt.user.client.ui.VerticalPanel;
public class GwtTest implements EntryPoint {
public void onModuleLoad() {
RootLayoutPanel rootPanel = RootLayoutPanel.get();
SimplePanel chartPanel = new SimplePanel();
chartPanel.getElement().setId("chartDiv");
chartPanel.setSize("500px", "500px");
Button button = new Button("Click Me");
button.addClickHandler(new ClickHandler(){
@Override
public void onClick(ClickEvent event) {
ChartData chartData = new ChartData();
String json = getChartJson(chartData);
JsArray<?> chartArrayData = JsonUtils.safeEval(json);
drawChart(chartArrayData, chartData);
}
});
VerticalPanel vp = new VerticalPanel();
vp.add(button);
vp.add(chartPanel);
rootPanel.add(vp);
loadChartLibrary();
}
private String getChartJson(ChartData chartData){
String json = "[";
json += "['"time'", '"" + chartData.title + "'"]";
json += ",";
json += "['"" + chartData.labelOne + "'"," + chartData.valueOne + "]";
json += ",";
json += "['"" + chartData.labelTwo + "'"," + chartData.valueTwo + "]";
json += ",";
json += "['"" + chartData.labelThree + "'"," + chartData.valueThree + "]";
json += "]";
return json;
}
private native void loadChartLibrary()/*-{
$wnd.google.charts.load('current', {packages: ['corechart']});
}-*/;
private native void drawChart(JsArray<?> dataArray, ChartData chartData)/*-{
var data = $wnd.google.visualization.arrayToDataTable(dataArray);
var chart = new $wnd.google.visualization.ColumnChart($wnd.document.getElementById('chartDiv'));
chart.draw(data, null);
$wnd.google.visualization.events.addListener(chart, 'select', selectHandler);
function selectHandler(e) {
var selectionArray = chart.getSelection();
if(selectionArray.length == 0){
}
else{
var row = selectionArray[0].row;
console.log(row);
this.@com.example.client.GwtTest::printChartData(Lcom/example/client/ChartData;I)(chartData, row);
console.log("here");
}
}
}-*/;
public void printChartData(ChartData chartData, int i){
System.out.println(i + ": " + chartData.valueThree);
}
}
如果你运行这个代码，你应该会看到一个按钮，上面写着点击我。点击那个按钮可以显示图表。然后单击图表中的条形图。我希望这会在printChartData()函数中触发我的Java代码，但我在JavaScript控制台中收到了一个错误。
我已经将问题缩小到以下代码：
var row = selectionArray[0].row;
console.log(row);
this.@com.example.client.GwtTest::printChartData(Lcom/example/client/ChartData;I)(chartData, row);
console.log("here");
行被正确地打印到控制台，所以我知道我的JavaScript正在工作。但是"here"从未打印到控制台，所以我知道错误在我的JSNI行中。
我的JSNI设置是否遗漏了什么？JavaScript错误是什么意思
我认为问题在于在处理程序中使用this。您可以预期this是GwtTest类的实例，但在指向处理程序的处理程序内部使用。这就是调用this.@com.example.client.GwtTest::printChartData失败的原因。
您可以在处理程序外部声明一个变量，并分配this，然后在处理程序内部使用它。
尝试：
var instance = this;
function selectHandler(e) {
var selectionArray = chart.getSelection();
if(selectionArray.length == 0){
}
else{
var row = selectionArray[0].row;
console.log(row);
instance.@com.example.client.GwtTest::printChartData(Lcom/example/client/ChartData;I)(chartData, row);
console.log("here");
}
}
ChartData没有扩展JavaScriptObject，因此当您调用
时，它抛出一个ClassCastExceptionCCD_ 11
亚当也是对的。在处理程序中使用this不起作用
这里有一个例子，它是如何工作的，只需覆盖整个GwtTest类。。
public class GwtTest implements EntryPoint {
private ChartData chartData;
public void onModuleLoad() {
RootLayoutPanel rootPanel = RootLayoutPanel.get();
SimplePanel chartPanel = new SimplePanel();
chartPanel.getElement().setId("chartDiv");
chartPanel.setSize("500px", "500px");
Button button = new Button("Click Me");
button.addClickHandler(new ClickHandler() {
@Override
public void onClick(ClickEvent event) {
chartData= ChartData.createJSO("Time", "Time");
for (int i = 0; i < 4; i++) {
RowData row = RowData.createJSO("label" + i, 100 + i);
chartData.add(row);
}
drawChart(chartData);
}
});
VerticalPanel vp = new VerticalPanel();
vp.add(button);
vp.add(chartPanel);
rootPanel.add(vp);
loadChartLibrary();
}
public static class ChartData extends JavaScriptObject {
protected ChartData() {
}
public static native ChartData createJSO(String chartname, String rowTypeDescriton) /*-{
return [ [ chartname, rowTypeDescriton ] ];
}-*/;
public final native RowData get(int index) /*-{
return this[index + 1];
}-*/;
public final native void add(RowData data) /*-{
this[this.length] = data;
}-*/;
}
public static class RowData extends JavaScriptObject {
protected RowData() {
}
public static native RowData createJSO(String label, int value) /*-{
return [ label, value ];
}-*/;
public final native String getLabelOne() /*-{
return this[0];
}-*/;
public final native int getValueOne() /*-{
return this[1];
}-*/;
}
private native void loadChartLibrary()/*-{
$wnd.google.charts.load('current', {
packages : [ 'corechart' ]
});
}-*/;
private native void drawChart(ChartData dataArray)/*-{
var self = this;
var data = $wnd.google.visualization.arrayToDataTable(dataArray);
var chart = new $wnd.google.visualization.ColumnChart($wnd.document
.getElementById('chartDiv'));
chart.draw(data, null);
$wnd.google.visualization.events.addListener(chart, 'select',
selectHandler);
function selectHandler(e) {
var selection = chart.getSelection();
for (var i = 0; i < selection.length; i++) {
var item = selection[i];
if (item.row != null) {
self.@com.example.client.GwtTest::printChartData(I)(item.row);
}
}
}
}-*/;
public void printChartData(int row) {
System.out.println(chartData.get(row));
}
}
相关文章：
- 解析JSON并从中删除对象会出错
- 将对象的列表c#传递给javascript:undefined变量时出错
- 通过GWT JSNI传递Java对象时出错
- CakePHP错误:在非对象上调用成员函数get(），使用cakejavascript助手时出错
- 尝试编写承诺时出错:承诺解析器对象不是函数
- '对象不是函数'尝试将页面对象与Protractor一起使用时出错
- JSON.parse在循环对象上未出错
- 谷歌应用程序脚本:;范围不是函数，它是对象;尝试在单元格中放置注释时出错
- 在ember.js中保存对象时出错:'对象X没有方法'保存''
- 使用JQuery和JSON将对象发送到JAX-RS时出错
- 在Javascript中将未定义转换为对象时出错
- 在 Javascript 中使用警报时出错(对象的属性“alert”不是函数）
- 更新 parse.com 分析对象时出错
- 使用对象构造函数管理 cssClasses 时出错
- 在 AngularJS 中将字符串转换为对象时出错
- 从对象引用请求动画帧时出错
- 在 Razor View 中设置 JavaScript 对象时出错
- 将对象转换为字符串 Javascript 时出错
- jQuery+Edge Animate:仅当从单击事件调用时才出错:对象 [对象对象] 没有方法“基础”
- 从数组查询获取对象 JSON 值时出错
