首页VUE3 vue-cookies COOKIES不设置过期时间，浏览器关闭后cookies清空，代码怎么写,使用组合式写法

VUE3 vue-cookies COOKIES不设置过期时间，浏览器关闭后cookies清空，代码怎么写,使用组合式写法

时间: 2025-01-27 21:13:08 浏览: 46

在Vue 3中使用组合式写法（Composition API）来设置不带有过期时间的cookies，使其在浏览器关闭后自动清空，可以按照以下步骤进行：首先，确保你已经安装了`vue-cookies`库。如果没有安装，可以使用以下命令进行安装： ```bash npm install vue-cookies --save ``` 然后，在你的`main.js`文件中引入并使用`vue-cookies`： ```javascript import { createApp } from 'vue'; import App from './App.vue'; import VueCookies from 'vue-cookies'; const app = createApp(App); app.use(VueCookies); app.mount('#app'); ``` 接下来，在你的组件中使用组合式写法来设置cookies： ```vue <template> <div> <button @click="setCookie">设置Cookies</button> </div> </template> <script> import { ref } from 'vue'; import { useCookies } from 'vue-cookies'; export default { name: 'CookieComponent', setup() { const { set } = useCookies(); const setCookie = () => { set('myCookie', 'cookieValue', { expires: '' }); }; return { setCookie }; } }; </script> ``` 在这个例子中，`set`方法用于设置cookies。由于`expires`选项被设置为空字符串，cookies不会设置过期时间，因此会在浏览器关闭后自动清空。

阅读全文

CSDN会员

开通CSDN年卡参与万元壕礼抽奖

海量 VIP免费资源千本正版电子书商城会员专享价千门课程&专栏

全年可省5,000元立即开通全年可省5,000元立即开通