Estoy creando una plantilla de 'vista' para las etiquetas de ciertos blogs. Estoy agarrando el nombre de la ruta con javascript e intentando insertar una sección de héroe en función de la etiqueta en la que se encuentra el usuario. Si codifico el nombre del blog y la etiqueta en la cadena de la sección, funciona. Pero si trato de interpolar las variables en él, obtengo un error de líquido.
El código:
const pathName = window.location.pathname; let blog_div = document.getElementById('blog-hero'); let blogName = pathName.split('/')[2]; let tagName = pathName.split('/')[4]; return blog_div.innerHTML = `{% section 'blog--hero-${blogName}-blog--${tagName}' %}`;Salida esperada: la sección se carga en la pantalla
Salida real: Nada en pantalla. Error en HTML: 'Error de líquido: Error en la etiqueta 'sección' - 'blog--hero-(blogName)-blog--(tagName)' no es un tipo de sección válido'
Terminé usando la API de representación de secciones, según los documentos .
Pero la línea JSON.parse() no funcionó. Así que tuve que usar los métodos onload, readyState y status según los documentos de MDN
El nuevo código terminó luciendo como
const pathName = window.location.pathname; let blog_div = document.getElementById('blog-hero'); let blogName = pathName.split('/')[2]; let tagName = pathName.split('/')[4]; let request = new XMLHttpRequest(); request.open('GET', `/?section_id=blog--hero-${blogName}-blog--${tagName}`) request.onload = () => { if(request.readyState === request.DONE) { if (request.status === 200) { blog_div.innerHTML = request.responseText; } } }; request.send(null);