Vuex+TS
时间:2021-09-16
本文章向大家介绍Vuex+TS,主要包括Vuex+TS使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。
// 1. 定义数据类型
// 定义根store的数据类型
export interface IRootStateTypes {
age: number
}
// 定义根store中的module中的数据类型
export interface TRootWitheModule {
// 引入login模块下的state中的数据类型
loginModule: ILoginStateTypes
// 如果有别的模块 可以引入其他模块的state数据类型
// testModule: ITestStateTypes
}
// 导出模块的中的state类型与根state中的交叉类型
export type IStoreType = IRootStateTypes & TRootWitheModule
// 2. 导出自定义的useStore
import { Store, useStore as useVuexStore } from "vuex"
import { IStoreType } from "./IRootStateTypes"
// 导出自定义的useStore并指出返回的数据类型
export function useStore(): Store
return useVuexStore()
}
// 3. 其他组件内使用
// 导入自定义的useStore
import { useStore } from "@/store/index"
setup() {
const store = useStore()
const userMenus = store.state.loginModule.userMenus
return { userMenus }
}
原文地址:https://www.cnblogs.com/rzl795/p/15302323.html
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- Android开发之底图局部加载移动的方法示例
- Ubuntu18.04下解决Qt出现qt.qpa.plugin:Could not load the Qt platform plugin “xcb“问题
- ExpandableListView实现手风琴效果
- 组复制性能 | 全方位认识 MySQL 8.0 Group Replication
- Android 中View.onDraw(Canvas canvas)的使用方法
- Android API编程之Assets文件操作示例
- Android自制精彩弹幕效果
- RollViewPager无限轮播使用方法详解
- ubuntu16.04 升级内核的方法步骤
- Android 列表倒计时的实现的示例代码(CountDownTimer)
- Android 控件设置阴影效果
- 解决VScode配置远程调试Linux程序的问题
- Android EasyBarrage实现轻量级弹幕效果
- android 获取本机其他app的版本信息的示例代码
- android相册选择图片的编码实现代码