Eu tenho um componente com um conjunto específico de dados iniciais:

data: function (){
    return {
        modalBodyDisplay: 'getUserInput', // possible values: 'getUserInput', 'confirmGeocodedValue'
        submitButtonText: 'Lookup', // possible values 'Lookup', 'Yes'
        addressToConfirm: null,
        bestViewedByTheseBounds: null,
        location:{
            name: null,
            address: null,
            position: null
        }
}

São dados para uma janela modal, portanto, quando mostra que quero começar com esses dados. Se o usuário cancelar da janela, desejo redefinir todos os dados para isso.

Eu sei que posso criar um método para redefinir os dados e apenas definir manualmente todas as propriedades dos dados de volta ao seu original:

reset: function (){
    this.modalBodyDisplay = 'getUserInput';
    this.submitButtonText = 'Lookup';
    this.addressToConfirm = null;
    this.bestViewedByTheseBounds = null;
    this.location = {
        name: null,
        address: null,
        position: null
    };
}

Mas isso parece realmente desleixado. Isso significa que, se alguma vez eu fizer uma alteração nas propriedades de dados do componente, precisará me lembrar de atualizar a estrutura do método reset. Isso não é absolutamente horrível, pois é um pequeno componente modular, mas faz a parte de otimização do meu cérebro gritar.

A solução que eu pensei que funcionaria seria pegar as propriedades iniciais dos dados em umready método e, em seguida, use os dados salvos para redefinir os componentes:

data: function (){
    return {
        modalBodyDisplay: 'getUserInput', 
        submitButtonText: 'Lookup', 
        addressToConfirm: null,
        bestViewedByTheseBounds: null,
        location:{
            name: null,
            address: null,
            position: null
        },
        // new property for holding the initial component configuration
        initialDataConfiguration: null
    }
},
ready: function (){
    // grabbing this here so that we can reset the data when we close the window.
    this.initialDataConfiguration = this.$data;
},
methods:{
    resetWindow: function (){
        // set the data for the component back to the original configuration
        this.$data = this.initialDataConfiguration;
    }
}

Mas oinitialDataConfiguration O objeto está mudando junto com os dados (o que faz sentido, porque no método de leitura, nossoinitialDataConfiguration está obtendo o escopo da função de dados.

Existe uma maneira de capturar os dados de configuração inicial sem herdar o escopo?

Estou pensando demais e há uma maneira melhor / mais fácil de fazer isso?

A codificação permanente dos dados iniciais é a única opção?