vue-class-component提供了mixinshelper函数,以类样式的方式使用mixins。通过使用mixins帮助程序,TypeScript可以推断mixin类型并在组件类型上继承它们。

声明mixin的示例:

// mixin.js
import Vue from 'vue'
import Component from 'vue-class-component' // You can declare a mixin as the same style as components.
@Component
export default class MyMixin extends Vue {
mixinValue = 'Hello'
}

使用mixin的示例:

import Component, { mixins } from 'vue-class-component'
import MyMixin from './mixin.js' // Use `mixins` helper function instead of `Vue`.
// `mixins` can receive any number of arguments.
@Component
export class MyComp extends mixins(MyMixin) {
created () {
console.log(this.mixinValue) // -> Hello
}
}

vue-class-component使用Mixins的更多相关文章

  1. 前端性能优化成神之路--vue组件懒加载(Vue Lazy Component )

    ---恢复内容开始--- 使用组件懒加载的原因 我们先来看看这样的一个页面,页面由大量模块组成,所有模块是同时进行加载,模块中图片内容较多,每个模块的依赖资源较多(包括js文件.接口文件.css文件等 ...

  2. vue之component

    因为组件是可复用的 Vue 实例,所以它们与 new Vue 接收相同的选项,例如 data.computed.watch.methods 以及生命周期钩子等.仅有的例外是像 el 这样根实例特有的选 ...

  3. Vue dynamic component All In One

    Vue dynamic component All In One Vue 动态组件 vue 2.x https://vuejs.org/v2/guide/components-dynamic-asyn ...

  4. vue & child component & props

    vue & child component & props vue pass data to child component https://vuejs.org/v2/guide/co ...

  5. Vue.js——component(组件)

    概念: 组件(Component)是自定义元素. 作用: 可以扩展HTML元素,封装可重用的代码. <div id="myView"> <!-- 把学生的数据循环 ...

  6. Vue中的“混合”——mixins使用方法

    混合是一种灵活的分布式复用 Vue 组件的方式.混合对象可以包含任意组件选项.以组件使用混合对象时,所有混合对象的选项将被混入该组件本身的选项.当组件和混合对象含有同名选项时,这些选项将以恰当的方式混 ...

  7. vue里extend、mixins、extends的区别

    1.extend Vue.extend使用基础 Vue 构造器,创建一个"子类".参数是一个包含组件选项的对象. // Vue.extend // 创建构造器 var Profil ...

  8. vue19 组建 Vue.extend component、组件模版、动态组件

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  9. [Vue] Use Vue.js Component Computed Properties

    You can add computed properties to a component to calculate a property on the fly. The benefit of th ...

  10. [Vue] Import component into page

    Components are one of the most powerful features of Vue. Let's take a look at how to write our first ...

随机推荐

  1. C# 反射基础用法

    1.引用命名空间 using System.Reflection; 2.object[] parameters = { 参数 }; 调用方法的参数数组 3.Type t = Type.GetType( ...

  2. 【linux】【FastDFS】FastDFS安装

    前言 FastDFS是一个开源的轻量级分布式文件系统,由跟踪服务器(tracker server).存储服务器(storage server)和客户端(client)三个部分组成,主要解决了海量数据存 ...

  3. 【linux】【maven】maven及maven私服安装

    前言 系统环境:Centos7.jdk1.8 私服是一种特殊的远程仓库,它是架设在局域网内的仓库服务,私服代理广域网上的远程仓库,供局域网内的用户使用.当Maven需要下载构件的时候,它从私服请求,如 ...

  4. 【译】Kubernetes监控实践(2):可行监控方案之Prometheus和Sensu

    本文介绍两个可行的K8s监控方案:Prometheus和Sensu.两个方案都能全面提供系统级的监控数据,帮助开发人员跟踪K8s关键组件的性能.定位故障.接收预警. 拓展阅读:Kubernetes监控 ...

  5. 第六届蓝桥杯java b组第8题

    乐羊羊饮料厂正在举办一次促销优惠活动.乐羊羊C型饮料,凭3个瓶盖可以再换一瓶C型饮料,并且可以一直循环下去,但不允许赊账. 请你计算一下,如果小明不浪费瓶盖,尽量地参加活动,那么,对于他初始买入的n瓶 ...

  6. 第八届蓝桥杯java b组第二题

    标题:纸牌三角形 A,2,3,4,5,6,7,8,9 共9张纸牌排成一个正三角形(A按1计算).要求每个边的和相等.        下图就是一种排法(如有对齐问题,参看p1.png). A       ...

  7. DataFrame 转换为Dataset

    写在前面: A DataFrame is a Dataset organized into named columns. A Dataset is a distributed collection o ...

  8. 如何把安全证书导入到java中的cacerts证书库

    每一步:进入某个https://www.xxx.com开头的网站,把要导入的证书下载, 在该网页上右键 >> 属性 >> 点击"证书" >> 再 ...

  9. Go语言入门教程(十)之函数

    Hello 各位小伙伴大家好,我是小栈君,假期一眨眼就过去了.不知道大家玩的是否开心呢? 上次我们讲到了关于Go语言的流程控制,小栈君也希望小伙伴跟着小栈君一步一个脚印的敲一下代码,相互进步.本期我们 ...

  10. MySQL InnoDB如何保证事务特性

    如果有人问你"数据库事务有哪些特性"?你可能会很快回答出原子性.一致性.隔离性.持久性即ACID特性.那么你知道InnoDB如何保证这些事务特性的吗?如果知道的话这篇文章就可以直接 ...