[英]Calling function defined in library from dart webcomponent
The web application has following code in app.dart 该Web应用程序在app.dart中具有以下代码
library app;
import 'dart:html';
var _loginClass;
void main() {
_loginClass = 'hide_login'; //set style to hide login web component by setting display:none
}
void showLogin(e) {
_loginClass = 'show_login';
print("span clicked");
}
void hideLogin(e) {
_loginClass = 'hide_login';
}
calling hideLogin(e) function from App.dart hides the web component. 从App.dart调用hideLogin(e)函数将隐藏Web组件。 but calling it from web component does not work. 但无法从Web组件调用它。
css is defined as follows: CSS定义如下:
.hide_login {
display: none;
}
.show_login {
display = block;
}
It's weird that you have "display: none;" 您“显示:无;”很奇怪 and "display = block;". 和“ display = block;”。 The second is not valid syntax. 第二个无效语法。
If that's not the right answer, try adding: 如果这不是正确的答案,请尝试添加:
import 'package:web_components/web_components.dart';
And then call dispatch(); 然后调用dispatch(); after setting _loginClass. 设置_loginClass之后。
It would probably be more dartish to use 使用它可能会更胆怯
<template instantiate="bool expression">
This makes showing and hiding a custom element like a login component incredibly easy 这使得显示和隐藏自定义元素(如登录组件)异常容易
example: 例:
login.html login.html
<html>
<body>
<element name="x-login" constructor="LoginComponent" extends="div">
<template instantiate="if showLogin">
...
<button on-click="validateLogin()">Login</button>
</template>
</element>
</body>
</html>
LoginComponent.dart LoginComponent.dart
import "package:web_ui/web_ui.dart";
class LoginComponent extends WebComponent {
bool showLogin = true;
bool validateLogin() {
...
showLogin = false;
}
}
Check out http://www.dartlang.org/articles/dart-web-components/ for further details 查看http://www.dartlang.org/articles/dart-web-components/了解更多详细信息
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.