vue2 系列:vue-property-decorator 用法

简介: vue2 系列:vue-property-decorator 用法

前言:vue2.0 支持 ts,需要用到 vue-property-decorator

1. 安装

npm i -D vue-property-decorator

2. 用法

// vue, compnent 必引入,其他按需引用
import { Vue, Component, Prop, PropSync, Watch, Emit } from "vue-property-decorator";
// 必须的
@Component();
export default class Demo extends Vue {
  // Prop, ! 表示非 null,非 undefined
  @Prop({ default: 18 })
  age!: number;
  // PropSync, 实现组件双向绑定,可以修改传过来的值
  @PropSync('sex', { type: String })
  syncedsex!: string;
  // data
  name: string = 'yqcoder';
  // Watch
  @Watch('name', { immediate: true, deep: true })
  onChangeName(new, old) {}
  // computed
  get nameL() {
    return this.name.length
  }
  // Emit: this.$emit('reset-name', 'yq')
  @Emit()
  resetName() {
    return 'yq'
  }
}


目录
相关文章
webpack优化篇(四十):速度分析:使用 speed-measure-webpack-plugin
webpack优化篇(四十):速度分析:使用 speed-measure-webpack-plugin
2351 0
webpack优化篇(四十):速度分析:使用 speed-measure-webpack-plugin
|
Web App开发 开发者
Mac Chrome crx(插件) 文件导出与导入
Mac Chrome crx(插件) 文件导出与导入
1208 0
|
API Android开发 iOS开发
web: 手机键盘自动获取短信验证码,点击自动填充输入框
web: 手机键盘自动获取短信验证码,点击自动填充输入框
1557 0
|
关系型数据库 MySQL Shell
mac安装mysql最新版(v8.0.15),并使用navicat连接本地数据库
mac安装mysql有两种方式,一种是官网下载安装包后安装,另一种是使用终端安装。 参考链接: 1、mac安装mysql,并使用navicat连接本地数据库 2、Mac Navicat 出现 2003 - Can’t connect to MySQL server on ‘127.0.0.1’ (61 “Connection refused”)
1175 0
mac安装mysql最新版(v8.0.15),并使用navicat连接本地数据库
|
JavaScript 前端开发 数据处理
vue2、vue3中使用$forceUpdate()
vue2、vue3中使用$forceUpdate()
2939 0
|
JavaScript 前端开发
Vue2整合TypeScript:借助vue-property-decorator以类模式编写组件
Vue2整合TypeScript:借助vue-property-decorator以类模式编写组件
713 3
|
8月前
|
JSON 前端开发 安全
前端开发中常用的鉴权方式解析与实践要点
本文深入探讨了前端开发中常用的鉴权方式,包括HTTP基本鉴权、Session-Cookie鉴权、Token验证、JWT(JSON Web Tokens)、单点登录(SSO)和OAuth等。文章首先明确了认证、授权、鉴权和权限控制的概念及关系,随后详细解析每种鉴权方式的工作原理、优缺点及适用场景。例如,HTTP基本鉴权简单但安全性低,适合内部网络;Session-Cookie鉴权易受CSRF攻击,适用于同域Web应用;Token和JWT无状态且扩展性好,适合分布式系统;SSO提升用户体验,适用于多系统统一登录;OAuth安全方便,适合第三方授权接入。
879 2
|
存储 缓存 JavaScript
【Uniapp 专栏】深入剖析 Uniapp 的运行机制原理
【5月更文挑战第12天】Uniapp是一款基于Vue.js的跨平台前端框架,通过抽象不同平台的差异,实现一套代码多平台运行,提升开发效率。其架构包括视图层(基于Vue.js组件)、逻辑层(JavaScript处理业务逻辑)和数据层(管理应用数据)。运行时,Uniapp会根据目标平台转换代码并适配。关键技术包括Web标准、原生插件和运行时环境。优化措施包含代码分包、数据懒加载和缓存机制。借助HBuilderX等工具,开发者能高效地进行开发和测试。Uniapp的运行机制融合多种技术,为跨平台应用开发提供便利。
1291 2
【Uniapp 专栏】深入剖析 Uniapp 的运行机制原理
|
前端开发 JavaScript
前端基础(八)_JavaScript循环(for循环、for-in循环、for-of循环、while、do-while 循环、break 与 continue)
本文介绍了JavaScript中的循环语句,包括for循环、for-in循环、for-of循环、while循环、do-while循环以及break和continue的使用。
1031 1
前端基础(八)_JavaScript循环(for循环、for-in循环、for-of循环、while、do-while 循环、break 与 continue)

热门文章

最新文章