vue怎么使用永久存储具有响应式

Vue中使用永久存储可以使用LocalStorage或者sessionStorage。LocalStorage和sessionStorage都是浏览器提供的API，用于在本地存储键值对数据。区别在于LocalStorage的数据是永久存储的，而sessionStorage的数据只在当前会话中有效，关闭浏览器后会被删除。

在Vue中使用LocalStorage或者sessionStorage需要使用一个插件vue-ls。该插件可以将LocalStorage或者sessionStorage封装成Vue的响应式属性，方便在Vue组件中使用。

安装vue-ls：

npm install vue-ls --save

在Vue项目中使用vue-ls：

import Vue from 'vue'
import VueLocalStorage from 'vue-ls'

Vue.use(VueLocalStorage)

// 在Vue组件中使用localStorage
export default {
  data() {
    return {
      message: this.$ls.get('message', 'Hello World')
    }
  },
  methods: {
    saveMessage() {
      this.$ls.set('message', this.message)
    }
  }
}

在上面的代码中，我们使用VueLocalStorage插件将localStorage封装成了Vue的响应式属性。在Vue组件中使用this.$ls即可访问localStorage。在data中初始化message时，使用this.$ls.get方法获取localStorage中的值。在saveMessage方法中，使用this.$ls.set方法将修改后的值存储到localStorage中。

注意：在使用vue-ls插件时，需要在Vue.use(VueLocalStorage)之前先安装和引入Vue