I would like to build a custom LWC layout using purely javascript:


Essentially I want to replace the ... between the DIV tag above using purely JavaScript. I can of course do this with standard HTML/CSS/JS projects, using innerHTML, appendChild, and the like. But how can I do this in a Lightning Web Component (especially with respect to lightning-record-edit-form, lightning-input-field, and lightning-button)?


I'm not 100% sure, but I think what you are looking for is the slot functionality in LWC. A slot tag is part of the new Web Components technology suite, it allows you to inject markup from a parent into a child component. See these links for background reference:

https://developer.mozilla.org/en-US/docs/Web/Web_Components/Using_templates_and_slots https://developer.mozilla.org/en-US/docs/Web/HTML/Element/slot

Here is some documentation from the Salesforce LWC Dev Guide :


  • Welcome to Salesforce SE! While this may theoretically answer the question, it would be preferable to include the essential parts of the answer here, and provide the link for reference. – identigral Oct 19 '19 at 15:13

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.