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. [Linux] Linux下undefined reference to ‘pthread_create’问题解决

    问题的原因:pthread不是Linux下的默认的库,也就是在链接的时候,无法找到phread库中函数的入口地址,于是链接会失败. 解决:在gcc编译的时候,附加要加 -lpthread参数即可解决.

  2. java数据结构——单链表、双端链表、双向链表(Linked List)

    1.继续学习单链表,终于摆脱数组的魔爪了,单链表分为数据域(前突)和引用域(指针域)(后继),还有一个头结点(就好比一辆火车,我们只关心火车头,不关心其它车厢,只需知晓车头顺藤摸瓜即可),头结点没有前 ...

  3. Spring 梳理-MVC-前端控制器DispatchServlet及URL请求处理过程

    大多数基于java的web框架,都有前端控制器 spring mvc请求过程 1. 请求会首先发送到DispatchServlet,这是spring的前置Servlet,它会接收请求并转发给sprin ...

  4. Excel VBA入门(十)用户窗体开发

    VBA 中的用户窗体就是指带 UI 的用户界面,在运行的时候会单独弹出一个窗口,类似于在 windows 系统中运行的一个可执行程序一样(这个说法不太严谨,因为可执行程序也可能是只有命令窗口而没有 U ...

  5. cvc-complex-type.2.3: Element 'dependency' cannot have character [children], because the type's cont

    直接复制网上的pom引入,报错 解决:自己手动输入一遍,不用直接复制,因为复制的时候,项目中编码跟网页上编码不一致,很容易导致出问题.

  6. python——pyinstaller踩的坑 UnicodeDecodeError

    程序本身运行没任何毛病,奈何用pyinstaller -w xx.py的时候提示——UnicodeDecodeError: 'ascii' codec can't decode byte 0xb3 i ...

  7. 防御 DDoS 的终极奥义——又拍云 SCDN

    现如今不论是年轻的 80.90 后,还是 70.60 后,都在享受互联网带来的舒适和便利.在家就可以"逛商场",完全不受时间的限制:在线支付既方便又安全:业余娱乐项目多种多样,打农 ...

  8. VirtualBox 启动时提示“获取 VirtualBox COM 对象失败”的解决

    昨天给电脑打了一堆补丁和更新,今天启动 VirtualBox 的时候提示 “获取 VirtualBox COM 对象失败”,好在百度到了 CSDN 上的一篇文章解决了这个问题. 错误详情 “获取 Vi ...

  9. 使用Docker Toolbox基于boot2docker搭建的Docker如何修改镜像源

    镜像源 由于众所周知的原因,我们直接连接这些位于国外服务器上的仓库去获取依赖包速度是非常慢的,这时候我们通常会采用国内一些组织或开发者贡献的国内镜像仓库. 1.首先Docker也提供了国内的镜像源:h ...

  10. 终端-Linux命令之非交互SSH密码验证-Sshpass

    Sshpass是使用SSH所谓的"交互式键盘密码身份验证"以非交互方式执行密码身份验证的工具 通俗来说就是 使用ssh密码登录 是需要在连接时手动输入密码的,没办法明文连接,如下图 ...