vue中的LoaclStorage存储布尔值

最新推荐文章于 2024-08-13 08:13:11 发布
最新推荐文章于 2024-08-13 08:13:11 发布
阅读量292 收藏
点赞数 1
文章标签： vue.js 前端 javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_48770716/article/details/125199211
版权
本文探讨了在Vue应用中，如何在store中使用LocalStorage存储布尔值时遇到的渲染问题，重点介绍了作者通过eval()函数处理并避免JSON转换导致的始终显示为true的问题，以及对这一现象背后原因的推测。
摘要由CSDN通过智能技术生成

在vue的store里面用LoaclStorage存储布尔值的时候，在组件中中需要改变这个布尔值的时候再次重新渲染到页面的时候会发现不管你存的是true还是false，组件中mounted打印的都会是true

原因未知

我的处理方法是调用eval（）函数重新保存一次

并且发现 如果用JSON来转换的话拿到的还会是true，所以我选择的是不进行JSON的转化

BUG生产大王
关注
vue更改数组中的值实例代码详解
10-15
在本知识点中，我们将重点探讨如何在Vue中更改数组中的值，以及如何保持Vue的响应式系统。 ### Vue更改数组中的值的方式 在Vue中，如果直接使用索引去设置数组中的一个项，如 `vm.array[index] = newValue`，这个...
Vue中localStroage存储
ioszhanghui的博客
07-01 1461
在Vue写项目的时候，有时候会存储一些用户的登录数据到本地，因为localStorage存储不受时间的限制，这就涉及到localStorage的增删改查。 1.增加数据 //保存数据 window.localStorage.setItem(key,value); 2.获取数据 //localStorage获取数据 window.localStrorage.getItem(key); ...
localStorage储存Boolean类型时出现的问题
山谷里的杂货铺
11-29 364
页面首次进入能取到Boolean类型，当刷新页面之后，取不到Boolean类型 解决办法，我们可以在存boolean类型时转换为字符串类型 store.commit('account/setSecretary',res.data.ifSecretary ? 'true' : 'false') ...
vue储存storage时含有布尔值的问题
深圳最菜前端
08-15 948
今天遇到一个问题，需要将后台返回的true和false存到storage中去，然后用储存的这个值进行逻辑判断，但是一直判断都是错误的，后面查阅了一下资料才发现 在localstorage中储存数据的时候，储存的boolean值都会变成字符串，而不是刚开始储存进去的boolean值 都变成了字符串 那么怎么解决呢 一：前端进行一次转化 if (localStorage.getItem('布尔值') == 'true') { // 重新赋值为新的值 '布尔值' = true } 或者是在储存的时候，
js使用本地缓存localstorage保存Boolean类型值采坑
qq_15620441的博客
09-01 1786
javascript本地缓存localstorage保存Boolean类型值需要注意的问题： 在使用vue框架搭建单页面应用时，肯定会遇到状态管理方面的问题，一种方案是使用全局变量挂载在全局vue实例上，另一种方案就是使用集成状态管理方案vuex,有些情况下需要我们使用缓存(localStorage、sesstionStorage)和vuex配合使用来管理状态，比如我们我遇到的一个场景，一个后台管理平台左侧菜单的展开状态，要求刷新页面后也要保持状态不变，这个状态值我们就用vuex和local...
从此告别表单数据丢失！vue教你缓存当前页面信息（keep-alive）
希望看完文章的你能够带着答案离开
09-23 7548
从此告别表单数据丢失！vue教你缓存当前页面信息（keep-alive）
vue中的循环对象属性和属性值用法
10-14
在本篇文章中，我们将详细讨论如何在Vue中使用`v-for`来循环对象的属性和属性值。 首先，让我们回顾一下在Vue中如何通过`v-for`循环数组。通常，对于数组，`v-for`的语法是这样的： ```html ...
vue获取form表单的值示例
10-16
在开发基于Vue.js的web应用时，经常会需要处理表单提交，以及获取表单中各个输入字段的值。本文档中将分享一个如何在Vue.js中获取form表单值的示例，使用的是Element-ui组件库以及axios库来发送HTTP请求。下面将详细...
vue 实现通过vuex 存储值 在不同界面使用
10-16
今天小编就为大家分享一篇vue 实现通过vuex 存储值 在不同界面使用，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
vue 清空input标签 中file的值操作
10-15
而在使用Vue.js框架时，清空input标签中type为file的值是一个常见的操作需求。当用户上传了文件后，可能需要提供一个按钮或者操作来清空已经选择的文件信息，以便用户可以重新选择文件，或者清理掉不需要的文件路径...
详解vue中localStorage的使用方法
12-09
什么是localStorage 对浏览器来说，使用 Web Storage 存储键值对比存储 Cookie 方式更直观，而且容量更大，它包含两种：localStorage 和 sessionStorage 1.sessionStorage（临时存储） ：为每一个数据源维持一个存储区域，在浏览器打开期间存在，包括页面重新加载 2.localStorage（长期存储） ：与 sessionStorage 一样，但是浏览器关闭后，数据依然会一直存在 所以上次使用cookie的时候就遇到了一个坑,设置后马上访问session会获取不到,蛋疼,还需要刷新一下,原因是: 当我们首次访问设置Cookie的页
store.js 入门教程
最新发布
gitblog_00225的博客
08-13 486
store.js 入门教程 store.jsCross-browser storage for all use cases, used across the web.项目地址:https://gitcode.com/gh_mirrors/st/store.js 1. 项目介绍 store.js 是一个轻量级的 JavaScript 库，旨在封装浏览器的 localStorage 功能，以实现跨浏...
vue基础
m0_68687804的博客
09-28 1789
使用v-bind给标签class设置动态的值语法：class="{类：布尔值}"布尔值在data定义 类在中定义场景。
5.6 Vue中的localStorage和sessionStorage浏览器端数据存储机制
蚊者逆袭的博客
04-26 3807
在 Vue 中，localStorage 是一种用于浏览器端数据存储的机制，它可以让你把数据存储在客户端本地。
Vue2
yanhhillo的博客
05-04 806
2022.5.4 学习笔记 目录 五、动态组件 & 插槽 & 自定义指令 5.1 动态组件 5.1.1 什么是动态组件 5.1.2 如何实现动态组件渲染 5.1.3 使用 keep-alive 保持状态 5.1.4 keep-alive 对应的生命周期函数 5.1.5 keep-alive 的 include 属性 5.2 插槽 5.2.1 什么是插槽 5.2.2 体验插槽的基础用法 5.2.3 具名插槽 5.2.4 作用域插槽 5.3 自定义指令 5.3.1
vue中localstorage的用法
yehaocheng520的博客
05-09 1722
vue中需要将内容存储到本地缓存中 这个地方的“文件数量”是从子组件中传递过来的，如果不进行处理，当此页面刷新时，数据会清空为0. 此时可以考虑将数据存储到本地缓存中。 子组件代码 <div class="submit"> <el-pagination background @current-change="handleCurrentChange" :current-page.sync="currentPage" :page-size="pagesize" l
vuex的存储数据
SongdanDab的博客
12-12 3130
vuex存储
使用vuex存取数据 四布曲
c_qianxia5040的博客
09-01 338
中的user对应第一步中的js文件名。3、将获取到的值存储到vuex中。
H5本地存储storage
维克多噗噗的博客
07-10 318
storage: sessionStorage session临时回话，从页面打开到页面关闭的时间段 窗口的临时存储，页面关闭，本地存储消失 localStorage 永久存储 （可以手动删除数据） Storage的特点
vue3响应式布尔值取反
09-17
Vue中，响应式布尔值取反可以使用computed属性来实现。可以创建一个computed属性，使用原布尔值作为依赖，然后在computed属性的getter函数中返回取反后的值。例如： ```javascript import { ref, computed } from 'vue'; const boolValue = ref(true); const negatedValue = computed(() => !boolValue.value); console.log(negatedValue.value); // 输出 false boolValue.value = false; console.log(negatedValue.value); // 输出 true ```
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值