Closed barisburakbalci closed 3 years ago
I've met this issue.
It seems like the author uses doc.body.innerHTML to wrap the responseText (.vue file).
As we know that a <slot>
tag should not be in a <table>
tag, so the <slot>
tag will appears above the <table>
tag.
I'm thinking to patch this by using plain-text or xml or something to parse template maybe... Any ideas?
In my case I solved it by add 'plainContent' to TemplateContext,
and in Component.load I added a Regex based method to extract template plain content by matching <template>
tag.
like this:
`extractTemplate:function(responseText){
var regexStart = /\<template\s[^\/]?(>)$/sm;
var regexEnd = /\<\/template>$/gsm;
var tagStartArr = regexStart.exec(responseText);
var tagEndArr = regexEnd.exec(responseText);
var indexStart = responseText.indexOf(tagStartArr[0]);
var indexEnd = responseText.lastIndexOf(tagEndArr[tagEndArr.length - 1]);
var result = responseText.substring(indexStart + tagStartArr[0].length, indexEnd);
return result;
}`
and I changed TemplateContext.getContent like this:
getContent: function() { if(this.plainContent){ return this.plainContent; }else{ return this.elt.innerHTML; } },
I think the perfect solution is to parse responseText using XML since JS has native API to parseXML, but it seems a LOT work to do. Should I pull a request?
I have a customer-list component & inside of it a customer component. They both rendering without any error. But rendering order is wrong. You might notice in below screenshots, customer component is inside a table > tbody . But comes before it. And then table > tbody renders afterwards.
Is there any trick to avoid this?