Я пытаюсь использовать пользовательский элемент в моем приложении, но после обновления до текущей версии lit-element я не могу найти функцию замены для _didRender . Я попытался firstUpdated и connectedCallback безуспешно. Что я должен делать. Код рендерится, но после рендеринга и анекдота вызова ajax я ожидал, что рендер будет обновлен, но он не
import {LitElement, html} from 'lit-element';
import '@material/mwc-formfield/mwc-formfield.js';
import '@material/mwc-checkbox/mwc-checkbox.js'
import '@polymer/iron-ajax/iron-ajax.js';
class FhirActiveStatus extends LitElement{
static get properties() {
return {
/**activeStatus is used to show active status of person true or false. Use this property to show/hide. Default: true */
activeStatus: {type:Boolean},
/**url is used to make AJAX call to FHIR resource. Default: null */
url: {type:String},
/**value is used to take the input value of each field*/
value: {type:Boolean}
}
}
/**default value of properties set in constructor*/
constructor() {
super();
this.activeStatus = 'true';
this.value = false;
}
/**_didRender() was used here after the ajax call had been made*/
async firstUpdated() {
this.shadowRoot.getElementById('ajax').addEventListener('iron-ajax-response', function (e) {
var active = this.parentNode.host;
if (e.detail.response.active) {
active.shadowRoot.querySelector('.activeState').checked = true;
}
else if (!e.detail.response.active) {
active.shadowRoot.querySelector('.activeState').checked = false;
}
else {
this.parentNode.removeChild(this.parentNode.querySelector('#activeDiv'));
}
});
}
render() {
return html`
<div id="activeDiv">
${this.activeStatus !== 'false' ? html`<mwc-formfield class="activeStatus" alignEnd label="ACTIVE STATUS:">
<mwc-checkbox id="active" checked="${this.value}" class="activeState" @click="${e => this.value = e.target.value}"></mwc-checkbox>
</mwc-formfield>` : ''}
</div>
<iron-ajax auto id="ajax" bubbles auto handle-as="json" url="${this.url}"></iron-ajax>
`;
}
}
window.customElements.define('fhir-active-status', FhirActiveStatus);