vue 监听localStorage.getItem('username')是否变化
时间: 2023-12-30 19:02:14 浏览: 91
vue watch监听对象及对应值的变化详解
5星 · 资源好评率100%
你可以使用 `window.addEventListener('storage', callback)` 来监听 `localStorage` 的变化,当 `localStorage` 中的值发生改变时,会触发 `storage` 事件。在回调函数中,你可以检查 `localStorage.getItem('username')` 的值是否发生了变化。例如:
```javascript
window.addEventListener('storage', function(event) {
if (event.key === 'username') {
const newUsername = event.newValue;
const oldUsername = event.oldValue;
console.log(`localStorage 'username' has changed from ${oldUsername} to ${newUsername}`);
}
});
```
这里 `event.key` 表示发生变化的 `localStorage` 键名,`event.newValue` 表示变化后的值,`event.oldValue` 表示变化前的值。在这个例子中,我们检查了 `event.key` 是否为 `'username'`,如果是,就会输出变化信息。
阅读全文