Problema con CSS e iconos
@raghuv9 Crear un componente personalizado de Vue para Grapesjs: y para usarlo realmente: Consulta este repo para más información. ¡Salud!
Lee la respuesta completa abajo ↓Pregunta
Hola @artf he instalado Grapes JS a NPM [ "Grapesjs": "^0.15.9"] y estoy usando Vue con Grapes Js, aquí está mi código
------------------------------------------------------------------------------------------------------------
importar uvas de 'uvas';
importar 'grapesjs/dist/css/grapes.min.css';
exportar default {
data() {
return {
editor: null
}
},
Métodos: {
cambio() {
this.$emit('change', this.editor.getHtml());
},
},
montado() {
this.editor = grapesjs.init({
contenedor: '#gjs'
})
this.editor.on('change', this.change);
}
}
Estoy teniendo problemas con CSS porque faltan pocos iconos y los que quedan no responden a ninguna acción. Y no hay errores cuando ejecuto NPM ni errores en la consola del navegador.
os-windows10, node-13.0.1,npm:6.13.0
**Así es como es mi interfaz**
! [Screenshot_11](https://user-images.githubusercontent.com/26516842/71341208-3c3e1f80-257f-11ea-8b1e-5366df82d921.png)Respuestas (1)
@raghuv9 Crear un componente personalizado de Vue para Grapesjs:
Importen uvas de 'uvasjs'
const VueGrapesjs = {
install (Vue, options = {}) {
const config = {
Presets: []
}
const { presets } = Object.assign(config, options)
if (presets.length) {
presets.forEach((data) => {
const {
Nombre,
opciones = {},
Cargador
} = datos
grapesjs.plugins.add(name, (editor) => {
loader(editor, opciones)
})
})
}
Vue.prototype.$grapesjs = grapesjs
}
}
exportar por defecto VueGrapesjs
y para usarlo realmente:
<template>
<div id="app">
<grapesjs :options="gjsConfigs" />
</div>
</template>
<script>
exportar default {
Nombre: 'App',
data () {
return {
gjsConfigs: {
Plugins: ['Gráficos']
}
}
}
}
</script>
Consulta este repo para más información. ¡Salud!
Preguntas y respuestas relacionadas
Continúa investigando con debates sobre temas similares.
Issue #1842
Mostrando dos veces algunas propiedades y tampoco mostrando algunas opciones.
Hola, @artf @NicoEngler, Tengo un problema extraño. Estoy usando grapes.js y grapes.min.css con la versión 0.14.50. Mientras selecciono cua...
Issue #2850
[PREGUNTA] Añadir un desplegable para bloquear usando Rasgos
Hola @artf, Espero que estés bien, Me preguntaba si podríais ayudarme con algún problema sencillo que estoy teniendo (recientemente he empe...
Issue #2733
[Pregunta]: Viendo comportamientos extraños al implementar uvas en mi sitio
Estoy probando una implementación muy sencilla de uvas. Y el único bloque requerido por el requerimiento automático al final es: Tengo dos...
Issue #1888
[Pregunta] Añadir html personalizado dentro de Canvas
Hola, Estoy usando uvas para exportar un json personalizado con toda la información que necesito, en lugar de HTML y CSS. Para hacer eso, e...
Plugins de pago que cumplen con este problema
Seleccionado por temas clave y relevancia de etiquetas para ayudarte a enviar más rápido.
Cargando recomendaciones de plugins de pago...
Consulta los plugins de código abierto de GrapesJS en GitHub O haz una búsqueda rápida en nuestro catálogo gratuito.
Explora plugins gratuitos →Los plugins premium incluyen soporte, actualizaciones regulares y funciones listas para producción — ahorrando días de trabajo de integración.
Explora plugins premium →Explorar categorías de plugins
Ve directamente a las páginas de categorías de plugins en el marketplace.