英文网站模板下载,合肥网站建设网站建设,wordpress添加投稿,网页设计师培训排行榜欢迎来到“雪碧聊技术”CSDN博客#xff01; 在这里#xff0c;您将踏入一个专注于Java开发技术的知识殿堂。无论您是Java编程的初学者#xff0c;还是具有一定经验的开发者#xff0c;相信我的博客都能为您提供宝贵的学习资源和实用技巧。作为您的技术向导#xff0c;我将… 欢迎来到“雪碧聊技术”CSDN博客 在这里您将踏入一个专注于Java开发技术的知识殿堂。无论您是Java编程的初学者还是具有一定经验的开发者相信我的博客都能为您提供宝贵的学习资源和实用技巧。作为您的技术向导我将不断探索Java的深邃世界分享最新的技术动态、实战经验以及项目心得。 让我们一同在Java的广阔天地中遨游携手提升技术能力共创美好未来感谢您的关注与支持期待在“雪碧聊技术”与您共同成长 目录
一、计数器案例练习pinia的基本使用步骤
1、在src目录下新建stores目录该目录专门用来存放store
2、在stores目录下新建文件counter.js定义Store包含数据方法
3、在组件中使用Store
4、展示效果
二、computed函数
1、computed函数是什么
2、总结
①computed函数用来根据已有的属性计算出新属性的值。
②说白了computed函数就是用来定义属性的。
三、异步action
1、什么是action
2、action分类
①同步action
②异步action
3、举例异步action的使用
①下载axios依赖
②在pinia的store中引入axios并编写异步方法异步action
③在组件中使用钩子函数onMounted调用异步方法异步action来获取结果、使用结果
④刷新页面查看效果
四、storeToRefs函数
1、通过一个案例引出storeToRefs函数
①我们不想使用.来获取store中的属性了于是尝试直接解构store来获取属性
②运行项目查看效果
2、使用storeToRefs函数来解决上述问题
3、演示效果
4、注意
①storeToRefs函数只能解构出store中的属性。
②如果想解构出store中的方法那么不能加storeToRefs而是直接解构
五、Pinia调试
1、在浏览器上下载vue.js devtools插件
2、右击项目页面点击检查点击vue
结语 一、计数器案例练习pinia的基本使用步骤
1、在src目录下新建stores目录该目录专门用来存放store 2、在stores目录下新建文件counter.js定义Store包含数据方法 3、在组件中使用Store 4、展示效果 以上就是使用pinia完成的一个计算机案例。
展示了pinia的基本使用步骤要牢牢记住。 二、computed函数
1、computed函数是什么 computed函数又叫计算属性函数用来根据一个属性的值计算出另一个属性的值。 举例 运行项目 2、总结
①computed函数用来根据已有的属性计算出新属性的值。
②说白了computed函数就是用来定义属性的。 三、异步action
1、什么是action 其实我们action就是方法即刚才我们在计算机案例的store中定义的、用来操作属性的方法如下 2、action分类
①同步action
②异步action
3、举例异步action的使用
①下载axios依赖
# 下载axios依赖
npm install axios ②在pinia的store中引入axios并编写异步方法异步action ③在组件中使用钩子函数onMounted调用异步方法异步action来获取结果、使用结果 ④刷新页面查看效果 四、storeToRefs函数
1、通过一个案例引出storeToRefs函数
①我们不想使用.来获取store中的属性了于是尝试直接解构store来获取属性 ②运行项目查看效果 2、使用storeToRefs函数来解决上述问题 3、演示效果 4、注意
①storeToRefs函数只能解构出store中的属性。
举例 ②如果想解构出store中的方法那么不能加storeToRefs而是直接解构
举例 五、Pinia调试
1、在浏览器上下载vue.js devtools插件 2、右击项目页面点击检查点击vue 结语 以上就是pinia的基本使用步骤、computed函数、异步action、storeToRefs函数、pinia调试的全部内容。 本专栏【Pinia】的全部内容到此结束~ 想了解更多的前端知识请关注本博主~~
