pinia中使用reactive声明变量,子页面使用时,值未改变,即不是响应式的(解决方法)

reactive赋值无效!reactive 不要直接data=赋值!!!会丢失响应式的,只能通过obj.属性 = 属性值赋值

方法一.
pinia 中直接使用ref定义变量即可

复制代码
export const useUserStore=defineStore('user',()=>{
    let loginUser=reactive({})
    return {
        loginUser
    }

})

方法二:

pinia中仍使用reactive ,通过obj.属性 = 属性值赋值

复制代码
将这里
const testObject = reactive({
	show:false,
	titleL:'这里是标题!'
});
改为
const testObject = reactive({
	aa:{
		show:false,
		titleL:'这里是标题!'
	}
});

赋值操作改为:

const clickHandle = (e)=>{
	testObject.aa.show = e.traget.checked;
}
相关推荐
布局呆星13 小时前
Vue Router 笔记(二):正则路由、组件通信与动态路由
前端·javascript·vue.js
rising start13 小时前
InsightEdu - 轻量智能学习平台
javascript·axios·css3·html5·fastapi·orm·dify
qq_3813385014 小时前
前端虚拟列表与无限滚动性能优化实战:从万级数据到丝滑体验
前端·javascript·html·优化
hexu_blog14 小时前
前端vue后端springboot如何实现图片格式转换
前端·javascript·vue.js
代码煮茶14 小时前
Vue3 项目规范实战 | ESLint+Prettier+Git Hooks 搭建前端代码规范体系
前端·javascript·vue.js
hexu_blog15 小时前
前端vue 后端springboot如何实现图片去水印
前端·javascript·vue.js
whuhewei15 小时前
React搜索框组件
前端·javascript·react.js
ZC跨境爬虫15 小时前
跟着 MDN 学 HTML day_50:(深入理解 DOM 中的 Text 节点)
前端·javascript·microsoft·ui·html·媒体
ZC跨境爬虫15 小时前
跟着 MDN 学 HTML day_51:(深入理解 XPathEvaluator 接口)
前端·javascript·ui·html·音视频
wjykp15 小时前
5.cypher语句组合与复杂操作
linux·前端·javascript