Saltar al contenido

Conflicto en la plantilla de Twig y Vue.js

Tenemos el arreglo a esta aprieto, o por lo menos eso pensamos. Si continuas con preguntas coméntalo, que para nosotros será un gusto ayudarte

Solución:

Simplemente cambie los delimitadores predeterminados para vue. Así es cómo:

Vue.js 1.0

Defina delimitadores globalmente (docs).

Vue.config.delimiters = ['$', '']

Vue.js 2.0

Defina delimitadores para el componente (docs).

new Vue(
  delimiters: ['$', '']
)

Vue.js 3.0

Definir delimitadores para la aplicación (docs).

Vue.createApp(
  delimiters: ['$', '']
)

En este caso, puede cambiar el marcador de etiqueta vue.js (si lo hay) o usar la etiqueta twig palabra por palabra (mucho mejor en mi opinión) que marca una sección como texto sin formato que no debe ser evaluado por twig parser. es decir:

% verbatim %
    new Vue(

        el: '.container',
        data: 
            foo: 'Hello world.'
        
    );
% endverbatim %

De los documentos de ramita:

La etiqueta textual marca las secciones como texto sin procesar que no debe analizarse. Por ejemplo, para poner la sintaxis de Twig como ejemplo en una plantilla, puede usar este fragmento:

  • etiqueta textual

Leí en otra pregunta similar para hacer:

"vue.js variable here" 

para hacerlo más corto. Funciona en ALGUNOS casos para mí. Pero, pensé que te gustaría verlo de todos modos…

Todavía no logré que funcionara en todas las áreas de mi código.

valoraciones y reseñas

Acuérdate de que tienes autorización de agregar una reseña si diste con el hallazgo.

¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *