Estou um pouco confuso sobre como alterar propriedades dentro de componentes, digamos que tenho o seguinte componente:

{
    props: {
        visible: {
            type: Boolean,
            default: true
        }
    },
    methods: {
         hide() {
              this.visible = false;
         }
    }
} 

Embora funcione, daria o seguinte aviso:

Evite alterar uma proposta diretamente, pois o valor será substituído sempre que o componente pai for renderizado novamente. Em vez disso, use dados ou propriedades calculadas com base no valor do suporte. Suporte sendo mutado: "visível" (encontrado no componente)

Agora estou me perguntando qual é a melhor maneira de lidar com isso, obviamente ovisible A propriedade é passada quando criado o componente no DOM:<Foo :visible="false"></Foo>