例如:vue-fullscreen

<template>
<div class="Test">
<fullscreen ref="fullscreen" @change="fullscreenChange" >
       <el-button @click="toggle">全屏</el-button>
something
</fullscreen>
</div>
</template> <script lang="ts">
import { Vue, Component, Prop, Watch } from 'vue-property-decorator';// @ts-ignore
import fullscreen from 'vue-fullscreen';
Vue.use(fullscreen); @Component({})
export default class Test extends Vue {
toggle() {
(this.$refs.fullscreen as fullscreen).toggle(); // !!!! as后面的fullscreen是引入后组件的名称
} fullscreenChange(status: boolean) {
this.fullscreen = status;
}
}
</script> <style lang="less" scoped>
.Test{}
</style>

typescript无法识别vue中的$refs的更多相关文章

  1. vue中使用refs定位dom出现undefined?

    之前在公司做项目,一直感觉用ref来定位dom节点挺方便的.但是期间遇到了一个问题,就是在mounted(){}钩子里面使用this.$refs.xxx,打印出来的却是undefined? 于是我就对 ...

  2. typescript整合到vue中的详细介绍,ts+vue一梭子

    通过vue-cli命令行安装vue项目,注意不要eslint 安装依赖 cnpm install typescript --save-dev cnpm install ts-loader --save ...

  3. vue中this.$refs可以拿到,但是里面的属性undefind的问题

    1.和vue的生命周期有关,必须要在从mounted开始拿,才能拿得到里面的Dom元素 2.想在element ui 对话框打开后取dom时,应该使用$nextTick,而不是直接使用this.$re ...

  4. 在 Vue 中使用 Typescript

    前言 恕我直言,用 Typescript 写 Vue 真的很难受,Vue 对 ts 的支持一般,如非万不得已还是别在 Vue 里边用吧,不过听说 Vue3 会增强对 ts 的支持,正式登场之前还是期待 ...

  5. vue中$refs的使用

    vue中$refs获取组件或元素: 获取的元素就相当于是一个原生获取的元素,可以进行操作 this.$refs.ele.style.color = 'red

  6. 在Vue 中使用Typescript

    Vue 中使用 typescript 什么是typescript typescript 为 javaScript的超集,这意味着它支持所有都JavaScript都语法.它很像JavaScript都强类 ...

  7. Vue 中使用 typescript

    Vue 中使用 typescript 什么是typescript typescript 为 javaScript的超集,这意味着它支持所有都JavaScript都语法.它很像JavaScript都强类 ...

  8. TypeScript基础以及在Vue中的应用

    TypeScript推出已经很长时间了,在Angular项目中开发比较普遍,随着Vue 3.0的即将推出,TypeScript在Vue项目中使用也即将成为很大的趋势,笔者也是最近才开始研究如何在Vue ...

  9. Vue 中的 ref $refs

    ref 被用来给DOM元素或子组件注册引用信息.引用信息会根据父组件的 $refs 对象进行注册.如果在普通的DOM元素上使用,引用信息就是元素; 如果用在子组件上,引用信息就是组件实例 注意:只要想 ...

随机推荐

  1. luogu 3919

    主席树 #include <iostream> #include <cstdio> #include <algorithm> #include <cmath& ...

  2. 实验1C语言开发环境使用和数据类型、运算符、表达式

    # include <stdio.h> int main() { char ch; printf("输入一个字符:\n"); scanf("%c", ...

  3. 【原创】sed正则表达式替换

    1.数字替换原数字 sed -i "s/\([0-9]*\)/\1/g"

  4. bootstrap中tab切换的使用

    文档地址:https://v3.bootcss.com/javascript/#tabs 简单实例: <!DOCTYPE html> <html lang="en" ...

  5. Jetbrain全栈最新激活方法(2019年及之前所有新老版本)

    随着2019版的到来,之前的永久激活教程也不生效了,所以今天为大家带来一种新的永久激活方式. 1.下载新版破解补丁 破解补丁传送门提取码:3e8j 点击传送门下载补丁文件 jetbrains-agen ...

  6. (5)打造简单OS-进入保护模式

    1.简介: 8086实模式 80286才出现保护模式,保护模式下的段寄存器存储的是段选择子,不在是8086实模式的段基址了! [扩展知识]:可以看了后面知识在回头看一下这段. [8086各个段寄存器和 ...

  7. 使用MockMVC与Junit进行单体测试

    1.pom.xml追加 junit spring-test 2.测试共通类 @ContextConfiguration(locations = { "classpath:springfram ...

  8. Js 之常见手势操作插件 Hammer.js

    一.下载 链接:https://pan.baidu.com/s/1UbEtSbT1xcmdzzTCaWmW1A提取码:ldqy 二.案例 三.代码 <!DOCTYPE html> < ...

  9. 手动制作BIOS和EFI多启动U盘

    原文链接:https://www.lainme.com/doku.php/blog/2017/07/%E5%88%B6%E4%BD%9Cbios%E5%92%8Cefi%E5%A4%9A%E5%90% ...

  10. Multiple commands produce "*.framework"

    参考链接记录个问题,这是xcode10后新build系统导致的,新系统帮我们检查了很多东西,最优化我们的构建, 两种方案 1.用旧的系统(不推荐)   2.这个是build setting->b ...