vue watch监听sessionStorage
时间: 2023-09-29 22:04:56 浏览: 122
在Vue中,你可以使用`watch`选项来监听`sessionStorage`的变化。首先,你需要在Vue组件的`data`选项中定义一个变量,用来存储`sessionStorage`的值。然后,在`watch`选项中监听该变量的变化。
下面是一个示例代码:
```javascript
<template>
<div>
<!-- 组件内容 -->
</div>
</template>
<script>
export default {
data() {
return {
sessionStorageValue: null
};
},
created() {
// 初始化时获取sessionStorage的值
this.sessionStorageValue = sessionStorage.getItem('key');
},
watch: {
sessionStorageValue(newValue) {
// 当sessionStorageValue的值发生变化时执行的回调函数
console.log('sessionStorage的值发生变化了', newValue);
}
}
};
</script>
```
在上述代码中,我们通过在`created`生命周期钩子中获取`sessionStorage`的值,并将其赋给`sessionStorageValue`。然后,通过在`watch`选项中监听`sessionStorageValue`的变化,当`sessionStorageValue`的值发生变化时,会执行相应的回调函数。
你可以根据实际需求在回调函数中进行相应的操作。
阅读全文