Vue-cli3: Click popUP component mask layer, error: Computed Property has no setter

Scenario description: The project uses the Vant UI framework, and an error occurs when the popup component is referenced and the mask layer is clicked

1, the source

<template>
    <van-popup v-model="toggle" position="right">content</van-popup>
</template>
<script>
    export default {
        computed: {toggle(){
                return this.show
            }
        }
    }
</script>
Copy the code

2, modify,

(1) Directly set the set method to toggle

   <script>
    export default {
        computed: {toggle: {get(){
                    return this.show
                  },
                  set(){
                    this.$emit('setFn')
                  }
            }
        }
    }
   </script> 
Copy the code

(2) Custom click mask layer event for POPUP component

<template>
    <van-popup v-model="show" position="right" @click-overlay="handleClickOverlay" :close-on-click-overlay="false">content</van-popup>
</template>
<script>
    export default {
        methods: {handleClickOverlay(){
              this.$emit('hideOverlay')}}}</script>
Copy the code