Description
I am trying to develop an upload file component. What I need is to reformat path to filename to show to user. But, I got haunted.js:492 Uncaught (in promise) TypeError: Cannot read property 'parentNode'.
Next the stack trace and code
haunted.js:492 Uncaught (in promise) TypeError: Cannot read property 'parentNode' of undefined
at teardownOnRemove (haunted.js:492)
at haunted.js:481
at AttributePart.commit (parts.ts:128)
at TemplateInstance.update (template-instance.ts:53)
at NodePart.__commitTemplateResult (parts.ts:280)
at NodePart.commit (parts.ts:221)
at render (render.ts:55)
at Scheduler.commit (haunted.js:138)
at Scheduler.handlePhase (haunted.js:111)
at Array. (haunted.js:98)
import { html } from "https://unpkg.com/lit-html/lit-html.js";
import { component, useState, useMemo, virtual } from "https://unpkg.com/haunted/haunted.js";
...
const FmtUploaded = virtual(() => {
return htmltesting
;
});
function ProductsUpload({ class:cls }) {
let [uploaded, setUploaded] = useState("");
const result = useMemo(() => uploadFile(uploaded), [uploaded]);
return html`
<style>
...
</style>
<div>
<input type="text" value="${FmtUploaded()}" class="custom-file-upload"/>
<label for="uploadFile" class="custom-file-upload">
<i class="fa fa-cloud-upload"></i> Seleccionar archivo
</label>
<input
id="uploadFile"
name="uploadFile"
type="file"
@change=${event => setUploaded(event.target.value)} />
<iron-icon id="searchButton" slot="suffix" suffix icon="paper-input-file:search" ></iron-icon>
<br/>
<p>${result}</p>
</div>
`;
}