例如: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. margin:auto你真的理解么

    含义 margin:auto是具有强烈计算意味的关键字,用来计算元素对应方向应该获得的剩余空间大小 填充规则 (1) 如果一侧定值,一侧auto,则auto为剩余空间大小 (2) 如果两侧均是auto ...

  2. grafana 的配置文件,和使用mysql数据库做持久化

    grafana 配置文件 vim /etc/grafana/grafana.ini 下面有些参数在新版中6.x版本中已经过时,请参考下面官网最新帮助文档为准 https://grafana.com/d ...

  3. springboot连接redis进行CRUD

    springboot连接redis进行CRUD: 1.添加以下依赖: <dependency> <groupId>org.springframework.boot</gr ...

  4. Hadoop mapreduce过程分析

    原理图: 中间结果的排序与溢出(spill)流程图 map分析: (1).输入分片(input split):在进行mapreduce之前,mapreduce首先会对输入文件进行输入分片(input ...

  5. vue中子组件传值给父组件

    index.js 子组件 父组件

  6. 隐藏tr

    <tr id="yinchang" style="display: none"></tr>     $("#yinchang& ...

  7. php手记之03-tp5渲染视图

    // 渲染视图 模块@文件/文件名 // return view('index@index/test'); // return view('index@test/test'); // return $ ...

  8. 了解有关 in_memory 工作空间的详细信息

    ArcGIS 提供了一个可写入输出要素类和表的内存工作空间.作为将地理处理输出写入磁盘上的某个位置或网络位置的备选方案,可将输出写入内存工作空间中.通常,将数据写入内存工作空间要明显快于写入其他格式( ...

  9. oracle中的trigger

    https://blog.csdn.net/indexman/article/details/8023740/ https://www.cnblogs.com/sharpest/p/7764660.h ...

  10. vue.js中如何使用scss

    要使用 <style lang="sass"> 請記得要裝相依的套件 $ npm install sass-loader node-sass vue-style-loa ...