typescript无法识别vue中的$refs
例如: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的更多相关文章
- vue中使用refs定位dom出现undefined?
之前在公司做项目,一直感觉用ref来定位dom节点挺方便的.但是期间遇到了一个问题,就是在mounted(){}钩子里面使用this.$refs.xxx,打印出来的却是undefined? 于是我就对 ...
- typescript整合到vue中的详细介绍,ts+vue一梭子
通过vue-cli命令行安装vue项目,注意不要eslint 安装依赖 cnpm install typescript --save-dev cnpm install ts-loader --save ...
- vue中this.$refs可以拿到,但是里面的属性undefind的问题
1.和vue的生命周期有关,必须要在从mounted开始拿,才能拿得到里面的Dom元素 2.想在element ui 对话框打开后取dom时,应该使用$nextTick,而不是直接使用this.$re ...
- 在 Vue 中使用 Typescript
前言 恕我直言,用 Typescript 写 Vue 真的很难受,Vue 对 ts 的支持一般,如非万不得已还是别在 Vue 里边用吧,不过听说 Vue3 会增强对 ts 的支持,正式登场之前还是期待 ...
- vue中$refs的使用
vue中$refs获取组件或元素: 获取的元素就相当于是一个原生获取的元素,可以进行操作 this.$refs.ele.style.color = 'red
- 在Vue 中使用Typescript
Vue 中使用 typescript 什么是typescript typescript 为 javaScript的超集,这意味着它支持所有都JavaScript都语法.它很像JavaScript都强类 ...
- Vue 中使用 typescript
Vue 中使用 typescript 什么是typescript typescript 为 javaScript的超集,这意味着它支持所有都JavaScript都语法.它很像JavaScript都强类 ...
- TypeScript基础以及在Vue中的应用
TypeScript推出已经很长时间了,在Angular项目中开发比较普遍,随着Vue 3.0的即将推出,TypeScript在Vue项目中使用也即将成为很大的趋势,笔者也是最近才开始研究如何在Vue ...
- Vue 中的 ref $refs
ref 被用来给DOM元素或子组件注册引用信息.引用信息会根据父组件的 $refs 对象进行注册.如果在普通的DOM元素上使用,引用信息就是元素; 如果用在子组件上,引用信息就是组件实例 注意:只要想 ...
随机推荐
- Redis学习之一--基础知识
一.定义 REmote DIctionary Server(Redis) 是一个以字典结构存储数据的key-value存储系统:使用ANSI C语言编写.遵守BSD协议.支持网络.可基于内存亦可持久化 ...
- vue文件中提示Expected Boolean, got String
这种情况是有一些属性的值应该填写Boolean类型,但是当前的值可能是“”--字符串 这种情况只需要在属性前面加上:即可. eg:
- Concurrent初探 --- Atomic 无锁
一.CAS算法 Compare And Swap,CAS算法的过程是这样:它包含3个参数CAS(V,E,N).V表示要更新的变量,E表示预期值,N表示新值.仅当V值等于E值时,才会将V的值设为N,如果 ...
- Web API 跨域
1. NuGet下载## microsoft.aspnet.webapi.cors 2 . Web API 路由中 config.EnableCors(new EnableCorsAttribute( ...
- ZR#997
ZR#997 解法: 找找规律就出来了,全场最简单的一道题. CODE: #include<iostream> #include<cstdio> #include<cst ...
- 【转载】Hadoop集群各部分常用端口号
hadoop集群的各部分一般都会使用到多个端口,有些是daemon之间进行交互之用,有些是用于RPC访问以及HTTP访问.而随着hadoop周边组件的增多,完全记不住哪个端口对应哪个应用,特收集记录如 ...
- 什么是vue的全家桶
vue.js有著名的全家桶系列,包含了vue-router,vuex, vue-resource,再加上构建工具vue-cli,就是一个完整的vue项目的核心构成.
- 详解css3 pointer-events(阻止hover、active、onclick等触发事件来
pointer-events 更像是JavaScript,它能够: 阻止用户的点击动作产生任何效果 阻止缺省鼠标指针的显示 阻止CSS里的 hover 和 active 状态的变化触发事件 阻止Jav ...
- OF1.7中的p_rgh【翻译】
翻译自:CFD-online 帖子地址:http://www.cfd-online.com/Forums/openfoam-solving/80454-p_rgh-1-7-a.html stawrog ...
- Linux单独打包工具-Ubuntu
Electron-Packager 使用electron-packager打包:https://github.com/electron/electron-packagerelectron-packag ...