Mis Opciones (en rasgos) para un componente seleccionado se reinician cada vez que recarga la página

Versión GrapesJS

• Confirmo que se debe usar la última versión de GrapesJS

¿Qué navegador usas?

Chrome

Enlace de demo reproducible

No está ahí

Describe el bicho

¿Cómo reproducir el bicho?

1. Instalar Grapes js e implementar el código select component
2. Arrastrar el componente select al editor
3. Haz clic en el componente select e introduce los rasgos
4. Recargar la página.

¿Cuál es el comportamiento esperado?

1. Las opciones introducidas no deben restablecerse en el gestor de rasgos para ese componente
2. Las opciones ya introducidas deberían estar visibles en el gestor de rasgos para ese componente

¿Cuál es el comportamiento actual? Mis Opciones (en rasgos) para un componente seleccionado se reinician cada vez que recarga la página

Si es necesario ejecutar algo de código para reproducir el error, pégalo aquí abajo:

! [options_issue](https://user-images.githubusercontent.com/50030377/141947836-5ff7009b-93ae-455b-8135-5a0a4ea91269.png)
 const trm = editor. TraitManager;
    trm.addType('select-options', {
      eventos:{
        'keyup': 'onChange',
      },

onValueChange: función () {
        var optionsStr = this.model.get('value').trim();
        var options = opciones Str.split('\n');
        var optComps = [];

para (var i = 0; i < options.length; i++) {
          var optionStr = options[i];
          var option = optionStr.split('::');
          var opt = {
            etiquetaNombre: 'opción',
            atributos: {}
          };
          if(opción[1]) {
            opt.content = opción[1];
            opt.attributes.value = option[0];
          } else {
            opt.content = option[0];
            opt.attributes.value = option[0];
          }
          optComps.push(opt);
        }

var comps = this.target.get('components');
        comps.reset(optComps);
        this.target.view.render();
      },

getInputEl: function() {
        si (!esto.$input) {
          var md = this.model;
          var trg = this.target;
          nombre var = md.get('nombre');
          var optionsStr = '';
          var opts = {marcador: ''};
          var options = trg.get('components');

para (var i = 0; i < options.length; i++) {
            var option = options.models[i];
            var optAttr = option.get('attributes');
            var optValue = optAttr.value || '';
            optionsStr += '${optValue}::${option.get('content')}\n';
          }

this.$input = document.createElement('textarea');
          this.$input.value = opcionesStr;
        }
        devuélvelo esto.$input;
      },
    });    

editor. Components.addType('input-select', {
      isComponent: el => el.tagName === 'SELECT',
       Definición del modelo
      modelo: {
        Predeterminados: {
          etiquetaNombre: 'select',
          componentes:{opciones: [ // Matriz de opciones
            { 'opt1':'Opción 1'},
          ]},
          arrastrable: 'forma, forma *', // Solo puede caerse dentro de los elementos de 'forma'
          Droppable: falso, // No se pueden colocar otros elementos dentro
          atributos: { // Atributos por defecto
            Tipo: 'seleccionar-opciones',
            Nombre: 'Select-Name',
            Clase:'Control-Forma'
          },
          rasgos: [{
            Tipo: 'Seleccionar-Opciones' // Tipos integrados: Texto, Número, Seleccionar, Casilla de Verificación, Color
          }],
          Añade algo de estilo, solo para que el componente sea visible
          estilo: {
          }
        }
      }
    });
    

Código de conducta

• Acepto seguir el Código de Conducta de este proyecto