vue-property-decorator的使用方法网上例子很多,可以参考: 使用demo 这里就不说了,主要说一下遇到的问题:

1.使用报错

import {Component, Vue,} from 'vue-property-decorator';

网上大都用的这种,我在vscode中vetur会报:Type ‘typeof import(“D:/work/working/vue-test/node_modules/vue/dist/vue”)’ is not a constructor function type.
搞了好久都不能解决,关闭vetur显然不合适,哪位大神能解决,可以给我留言
正确用法:

// An highlighted block
import { Options, Vue } from "vue-class-component";
import { Prop, Component, Emit } from "vue-property-decorator";

@Options({})
export default class Demo extends Vue {
  @Prop({ default: "sangbin", type: String })
  sang!: string;

  @Emit("submitp")
  public submit() {
    console.log("----submit-----");
    return { aa: "bb" };
  }
}

2.props传参数问题

网上说法,数据只能从父组件传到子组件,不能回传,我测试了一下
如果是字符串父组件修改,子组件可以得到,反之不行
但是如果是对象,在不改变引用的情况下,在子组件修改属性值,父组件是可以得到的

3.动态组件切换

    <component :is="com"></component>
@Options({
	components: {
   		Demo,
  		Demo2
	 }
})
export default class HelloWorld extends Vue {
  com='Demo2'
}

必须要在components中引入,不然找不到,也不会报错,只是显示不出来

===================================================================
梦想还是要有的,万一实现了呢!

Logo

智屏生态联盟致力于大屏生态发展,利用大屏快应用技术降低开发者开发、发布大屏应用门槛

更多推荐