由于vue.js的特殊机制,初始化后给对象添加的属性是无法更新UI的.

最近结合typescript和vue进行web开发,就遇到了这样的坑.

class user{

name:string;

age:number;

constructor(){

}

}

var v=new Vue(var v2 = new Vue({
            el: '#app',
            data: {
               user:new user()
            }});

如果直接这样把user提交给vue,后续user.name='xxxx',UI是不会更新的

再控制台打印出user,什么都没有,因此务必在构造函数中初始化字段:

constructor(){

this.name="";

this.age=0;

}

脑袋里一定要有根线:ts中class interface之类的东西只是为了声明!!!

Typescript中的class interface 只是在声明,其实什么也没有干!的更多相关文章

  1. 转载:《TypeScript 中文入门教程》 11、声明合并

    版权 文章转载自:https://github.com/zhongsp 建议您直接跳转到上面的网址查看最新版本. 介绍 TypeScript有一些独特的概念,有的是因为我们需要描述JavaScript ...

  2. 在TypeScript中使用其他JS框架或库的方法

    最近刚刚接触TypeScript,感觉非常强大,但是也有一些问题. 比如我们正常写js时,只要把其他js库引入页面,甚至于只要加入到项目中,ReSharper就会自动分析他,并提供语法只能感知,写代码 ...

  3. 十分钟教你理解TypeScript中的泛型

    转载请注明出处:葡萄城官网,葡萄城为开发者提供专业的开发工具.解决方案和服务,赋能开发者.原文出处:https://blog.bitsrc.io/understanding-generics-in-t ...

  4. TypeScript 高级类型 接口(interface)

    在代码的实现或者调用上能设定一定的限制和规范,就像契约一样.通常,我们把这种契约称为接口. TypeScript的核心原则之一是对值所具有的结构进行类型检查. 有时称为“鸭式辨型法”或“结构性子类型化 ...

  5. 关于typescript中的枚举你需要知道这些

    数字枚举 数字枚举,即枚举里所有属性的值都是数字类型,先看这段代码: enum Colors { Red, Blue, Yellow } console.log(Colors.Red) console ...

  6. TypeScript中的private、protected

    首先我们要清楚 private . protected 现阶段只是javascript中的保留字(Reserved words),而非关键字(Keywords ).因此TypeScript中的纯类型声 ...

  7. TypeScript 中命名空间与模块的理解?区别?

    一.模块 TypeScript 与ECMAScript 2015 一样,任何包含顶级 import 或者 export 的文件都被当成一个模块 相反地,如果一个文件不带有顶级的import或者expo ...

  8. 介绍Unreal Engine 4中的接口(Interface)使用C++和蓝图

    这个教程是从UE4 Wiki上整理而来. 在C++中直接使用Interface大家应该很熟悉.只是简单先定义一个个有虚函数的基类,然后在子类中实现相应的虚函数.像这样的虚函数的基类一般概念上叫接口.那 ...

  9. TypeScript中的怪语法

    TypeScript中的怪语法 如何处理undefined 和 null undefined的含义是:一个变量没有初始化. null的含义是:一个变量的值是空. undefined 和 null 的最 ...

随机推荐

  1. ADO.NET 访问数据库

    对数据库的访问时各种数据库应用程序开发的核心技术,.NET框架中提出的ADO.NET技术为应用程序的开发提供了一致的接口,增强了程序的可移植性和可扩展性. a:使用链接对象Connection连接数据 ...

  2. 解决Gradle编译时出现: 编码GBK的不可映射字符

    解决Gradle编译时出现: 编码GBK的不可映射字符 在build.gradle文件中加入如下内容: [compileJava, compileTestJava]*.options*.encodin ...

  3. (转)px、em、rem的区别和使用

    国内的设计师大都喜欢用px,而国外的网站大都喜欢用em和rem(国外的大部分网站能够调整的原因在于其使用了em或rem作为字体单位),那么三者有什么区别,又各自有什么优劣呢? 一.px特点 1. IE ...

  4. Java中的方法应用

    一.如何定义java中的方法 所谓方法,就是用来解决一类问题的代码的有序组合,是一个功能模块. 语法: 1. 访问修饰符:方法允许被访问的权限范围, 可以是 public.protected.priv ...

  5. mybatis 对于基本类型数据传值的问题

    最近在开发的时候,遇到一个小问题: Caused by: org.apache.ibatis.reflection.ReflectionException: There is no getter fo ...

  6. VMware中linux配置1-安装VMware tool 共享文件夹

    linux:ubuntu 14 安装Linux,使用的ubuntu-14.04.1-desktop-amd64.iso 安装的,这个就不写了. 为了在linux中访问windows的目录,需要安装VM ...

  7. gulp教程之gulp-uglify

    简介: 使用gulp-uglify压缩javascript文件,减小文件大小. 1.安装nodejs/全局安装gulp/项目安装gulp/创建package.json和gulpfile.js文件 1. ...

  8. Python笔记总结week2

    1. 关于Python程序执行原理:

  9. iOS---自动布局

    自动布局的发展 1.frame:通过代码计算 frame iPhone3GS \ iPhone4 \ iPhone4S 屏幕的物理尺寸是一样的(无需屏幕适配), 而且一个当时的应用要么是横屏要么是竖屏 ...

  10. 深度讲解VIEWPORT和PX是什么?移动端单位px,em,rem

    刚开始接触移动页面重构,是不是很迷惑应该按照多大的尺寸制作?320.640还是720?按照640的设计稿重构完页面,是不是还需要写其他尺寸来适配不同的屏幕大小?—— 这源于对viewport和px的不 ...