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元素上使用,引用信息就是元素; 如果用在子组件上,引用信息就是组件实例 注意:只要想 ...
随机推荐
- CSPS分数取mod赛92-93
我好菜啊..... 92只会打暴力,93暴力都不会了 模拟92, T1:直接ex_gcd加分类讨论即可 T2:考场只会打暴搜,正解为排序后线段树解决,排序的关键字为a+b,因为如果ai<bj&a ...
- 洛谷P2305 [NOI2014]购票 [DP,树状数组]
传送门 思路 显然是树形DP,显然是斜率优化,唯一的问题就是该怎么维护凸包. 套路1:树上斜率优化,在没有这题的路程的限制的情况下,可以维护一个单调栈,每次加入点的时候二分它会加到哪里,然后替换并记录 ...
- 解决Ubuntu19.04无法安装SecureCRT
推荐下载SecureCRT的tar包 在ubuntu19.04上安装SecureCRT的时候,报错libssl1.0.0-xxx没有安装 解决办法:下载并安装libssl1.0.0_1.0.1t-1+ ...
- NPM私有包部署到私有仓库
NPM私有包部署到私有仓库1.项目部署到NPM2.私有仓库的搭建1,项目部署到NPM注册NPM账号注册地址:https://www.npmjs.com/ 注册完成后进入邮箱验证 账号登录 npm lo ...
- MAC常用快捷键 基本常用的都整理在这里了
写在前面Mac系统中有几个比较特殊的功能键,和Win系统的区别也主要在这里比如在Win系统中我们常用的Ctrl键,在Mac系统中对应的不是长得比较像的Cnotrol,而是Command键,貌似也是Ma ...
- Flutter移动电商实战 --(48)详细页_详情和评论的切换
增加切换的效果,我们主要是修改这个地方 这样我们的评论的内容就显示出来了 最终代码 details_web.dart import 'package:flutter/material.dart'; i ...
- gitment初始化评论跳回博客首页
表现 众所周知,gitment评论系统需要初始化以创建对应的issue,可是我在点击login with github的时候,总是跳向博客首页!WTF!什么鬼?这样不程序啊? 排查 1.F12查看lo ...
- Android向系统日历添加日程提醒事件
在项目开发过程中,有时会有预约提醒.定时提醒等需求,这时我们可以使用系统日历来辅助提醒.通过向系统日历中写入事件.设置提醒方式(闹钟),实现到达某个特定的时间自动提醒的功能.这样做的好处是由于提醒功能 ...
- ColorMatrix图片饱和度设置
package com.loaderman.customviewdemo; import android.app.Activity; import android.graphics.Bitmap; i ...
- Pytho之Django
Django工程目录讲解: manage.py脚本:用于管理Django站点 settings.py: 包含项目的所有配置参数 urls.py: URL根配置 wsgi.py: 内置runserver ...