js 互操作回调函数中未捕获的 TypeError "is not a function"
Uncaught TypeError "is not a function" in js interop callback function
我创建了这个示例项目:https://github.com/mfMeds/jsdart
重现我的错误。
错误:
main.dart.js:5036 Uncaught TypeError: J.ab(...).ge5 is not a function
at Object.J.fm (main.dart.js:5036)
at cH.dart.cH.eu (main.dart.js:4962)
at Object.eval (eval at di (main.dart.js:786), <anonymous>:3:36)
at Object.ir (main.dart.js:628)
at dart.kZ (main.dart.js:4005)
at ChartElement.<anonymous> (main.dart.js:3998)
at ChartElement.update (Chart.js:8803)
at ChartElement.handleEvent (Chart.js:9100)
at Chart.eventHandler (Chart.js:4521)
at listener (Chart.js:4455)
只有当我使用变量 a
的属性时才会出现此错误。使用 window.console.log(a)
它正在记录对象而没有错误。
我的错误发生在这里:https://github.com/mfMeds/jsdart/blob/master/lib/src/zgraph/zgraph.dart#L80
@override
ngAfterViewInit() {
List<String> myDays = new List();
List<double> myData = new List();
myDays.add('Monday');
myData.add(12.0);
var data = new LinearChartData(labels: myDays, datasets: <ChartDataSets>[
new ChartDataSets(label: 'My Label', steppedLine: true, data: myData),
]);
var aOptions = new ChartAnimationOptions();
var config = new ChartConfiguration(
type: 'bar',
data: data,
options: new ChartOptions(
responsive: true,
maintainAspectRatio: false,
legend: new ChartLegendOptions(display: false),
//scales: new ChartScales(yAxes: [new ChartYAxe(ticks: new TickOptions(max:20))]),
animation: aOptions,
tooltips: new ChartTooltipOptions(
enabled: false,
custom: allowInterop(customTooltip), // <-- binding the method here
)));
new Chart(mycanvas, config);
}
void customTooltip(dynamic a) {
window.console.log(a);
if (a.opacity == 0) { // <-- The error happens here
//tooltipEl.style.opacity = '0';
return;
}
}
当我像这样为应用程序提供服务时,一切正常:
pub global run webdev serve web:xxxx.
只有在构建这样的应用程序时,我才会收到此错误:
pub global run webdev build --output=web:build
他们在文档中写道:
JavaScript 对象的属性可通过 [] 和 []= 运算符访问。方法可通过 callMethod 调用。
我也试过了,但是不行...
我找到了其他解决方案。动态 a 是一个 js 对象。您可以使用 js.getProperty 访问 js 对象 我为此做了一个 class:
import 'package:js/js_util.dart' as js;
class JsObject {
final dynamic _object;
const JsObject(this._object);
dynamic operator[](String name) => js.getProperty(_object, name);
operator[]=(String name, dynamic value) => js.setProperty(_object, name, value);
}
然后您可以使用
访问
// a is your js object
var jsA = new JsObject(a);
jsA['YOUR_PROPERTY']
我创建了这个示例项目:https://github.com/mfMeds/jsdart 重现我的错误。
错误:
main.dart.js:5036 Uncaught TypeError: J.ab(...).ge5 is not a function
at Object.J.fm (main.dart.js:5036)
at cH.dart.cH.eu (main.dart.js:4962)
at Object.eval (eval at di (main.dart.js:786), <anonymous>:3:36)
at Object.ir (main.dart.js:628)
at dart.kZ (main.dart.js:4005)
at ChartElement.<anonymous> (main.dart.js:3998)
at ChartElement.update (Chart.js:8803)
at ChartElement.handleEvent (Chart.js:9100)
at Chart.eventHandler (Chart.js:4521)
at listener (Chart.js:4455)
只有当我使用变量 a
的属性时才会出现此错误。使用 window.console.log(a)
它正在记录对象而没有错误。
我的错误发生在这里:https://github.com/mfMeds/jsdart/blob/master/lib/src/zgraph/zgraph.dart#L80
@override
ngAfterViewInit() {
List<String> myDays = new List();
List<double> myData = new List();
myDays.add('Monday');
myData.add(12.0);
var data = new LinearChartData(labels: myDays, datasets: <ChartDataSets>[
new ChartDataSets(label: 'My Label', steppedLine: true, data: myData),
]);
var aOptions = new ChartAnimationOptions();
var config = new ChartConfiguration(
type: 'bar',
data: data,
options: new ChartOptions(
responsive: true,
maintainAspectRatio: false,
legend: new ChartLegendOptions(display: false),
//scales: new ChartScales(yAxes: [new ChartYAxe(ticks: new TickOptions(max:20))]),
animation: aOptions,
tooltips: new ChartTooltipOptions(
enabled: false,
custom: allowInterop(customTooltip), // <-- binding the method here
)));
new Chart(mycanvas, config);
}
void customTooltip(dynamic a) {
window.console.log(a);
if (a.opacity == 0) { // <-- The error happens here
//tooltipEl.style.opacity = '0';
return;
}
}
当我像这样为应用程序提供服务时,一切正常:
pub global run webdev serve web:xxxx.
只有在构建这样的应用程序时,我才会收到此错误:
pub global run webdev build --output=web:build
他们在文档中写道: JavaScript 对象的属性可通过 [] 和 []= 运算符访问。方法可通过 callMethod 调用。
我也试过了,但是不行...
我找到了其他解决方案。动态 a 是一个 js 对象。您可以使用 js.getProperty 访问 js 对象 我为此做了一个 class:
import 'package:js/js_util.dart' as js;
class JsObject {
final dynamic _object;
const JsObject(this._object);
dynamic operator[](String name) => js.getProperty(_object, name);
operator[]=(String name, dynamic value) => js.setProperty(_object, name, value);
}
然后您可以使用
访问// a is your js object
var jsA = new JsObject(a);
jsA['YOUR_PROPERTY']