,当我在LitElement应用程序中实现AppLocalizeBehavior时出现以下错误
---package.json ---
"dependencies": {
"@polymer/app-layout": "^3.0.0",
"@polymer/app-localize-behavior": "^3.0.1",
"@polymer/polymer": "^3.1.0",
"@webcomponents/webcomponentsjs": "^2.2.4",
"lit-element": "^2.0.0-rc.3",
"pwa-helpers": "^0.9.0",
"redux": "^4.0.0",
"redux-thunk": "^2.3.0",
"reselect": "^4.0.0"
},
"devDependencies": {
"@polymer/test-fixture": "^4.0.2",
"axe-core": "^3.0.0",
"chai": "^4.1.2",
"del": "^3.0.0",
"gulp": "^4.0.0",
"gulp-rename": "^1.3.0",
"gulp-replace": "^1.0.0",
"mocha": "^5.2.0",
"pixelmatch": "^4.0.2",
"polymer-cli": "^1.9.3",
"polyserve": "^0.27.0",
"prpl-server": "^1.4.0",
"puppeteer": "^1.5.0",
"wct-mocha": "^1.0.0"
}
---旧的我的应用程序.js--
class MyApp extensions connect(store)(LitElement) { ....
---AppLocalizeBehavior my-app.js ---
从'@polymer/polymer/lib/legacy/class.js'导入{mixinBehaviors}; 导入 {AppLocalizeBehavior} '@polymer/app-localize-behavior/app-localize-behavior.js';
类 我的应用扩展 connect(store)(mixinBehaviors([AppLocalizeBehavior],LitElement)) { .....
-----错误--------------
updating-element.ts:487 Uncaught TypeError: Cannot read property 'forEach' of undefined
at HTMLElement._saveInstanceProperties (updating-element.ts:487)
at HTMLElement.initialize (updating-element.ts:467)
at HTMLElement.initialize (lit-element.ts:130)
at new UpdatingElement (updating-element.ts:230)
at new LitElement (lit-element.ts:76)
at new PropertiesChanged (properties-changed.js:170)
at new PropertyAccessors (property-accessors.js:115)
at new TemplateStamp (template-stamp.js:125)
at new PropertyEffects (property-effects.js:1195)
at new PropertiesMixin (properties-mixin.js:115)
我在IronValidatorBehavior上遇到了同样的问题。
不适用于 PolymerElement 和 LitElement
class EmailValidator extends mixinBehaviors([IronValidatorBehavior], PolymerElement)
class EmailValidator extends mixinBehaviors([IronValidatorBehavior], LitElement)
这是IronValidatorBehavior的工作代码。
电子邮件验证器.js
import {IronValidatorBehavior} from '@polymer/iron-validator-behavior/iron-validator-behavior';
import {Polymer} from '@polymer/polymer/lib/legacy/polymer-fn.js';
import {isValidEmail} from '../../utils/EmailValidator'
Polymer({
is: 'email-validator',
behaviors: [IronValidatorBehavior],
validate: function (value) {
return isValidEmail(value);
}
});
然后在主组件中。
import './validation/email-validator';
<email-validator id="email-validator"></email-validator>
<paper-input id="email" alwaysFloatLabel auto-validate required error-message="Invalid Email" validator="email-validator" value="${this._email}" @change=${(e) => this._email = e.target.value} label="Email"></paper-input>