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;
}
相关推荐
2301_799073023 小时前
基于 Next.js + 火山引擎 AI 的电商素材智能生成工具实战——字节跳动前端训练营成果
javascript·人工智能·火山引擎
kyriewen115 小时前
项目做了一半想重写?这套前端架构让你少走3年弯路
前端·javascript·chrome·架构·ecmascript·html5
爱折腾的军哥7 小时前
首发 | OpenTaiji WFGY 防幻觉系统:让 AI Agent 不再"胡说八道"
javascript
颜酱7 小时前
从零实现「拍照记单词」小应用(可复刻版)
前端·javascript·人工智能
大猫会长7 小时前
AudioContext给音频提高音量
前端·javascript·音视频
WayneYang8 小时前
JavaScript ES6+ (ES2015~ES2024) 全特性整理
前端·javascript
JustNow_Man8 小时前
Bun 常用命令速查清单(TypeScript 编译篇)
前端·javascript·typescript
|晴 天|8 小时前
从零打造现代化个人博客:Vue 3 + TypeScript + Element Plus 完整实战
javascript·css·chrome·typescript·html5·webstorm
lion109 小时前
简单Canvas指纹示例
javascript
M ? A10 小时前
Vue v-bind 转 React:VuReact 怎么处理?
前端·javascript·vue.js·经验分享·react.js·面试·vureact