How when entering a page, pop-up announcements, and display only once

In general this first pop-up announcement will be made in a separate document, the specific method is not to say, mainly talk about how to enter the pop-up and display only once.

<template>
  <div class="rule" v-if="showPopupintegral">
    <el-dialog  
      :visible.sync="centerDialogVisible1" 
      center>
       
    </el-dialog>
  </div>
</template>
<script>
export default {
  data () {
    return {
      centerDialogVisible1:true,
      showPopupintegral:false,
    }
  },
  created () {
    // first time according to pop and displayed only once localStorage 
    IF ( ! LocalStorage.getItem ( " showPopupintegral " )) {
       the this .showPopupintegral =  to true 
    } 
  }, 
  Methods: { 
    // function called closed pop 
    hideWelDialo () {
       the this .showPopupintegral =  to false 
      localStorage.setItem ( " showPopupintegral " , " to true " ); 
    }, 
  }, 
} 
</ Script >

That's it, welcome to exchange and correction.