一、问题产生背景:

  子组件的一个方法:

update () {
this.$nextTick(() => {
this.ul_slots.forEach((ul, cur_slots_index) => {
if (ul.getAttribute("class").indexOf("select_slots") < 0) {
return;
}
let liHeight = ul.children[0].offsetHeight
ul.style.height = (liHeight * ul.children.length) + 'px'
});
});
}

  父组件通过ref获取执行子组件的方法:

 this.$refs.areapicker.update();

  TS报错:

二、尝试解决

(1)将整个子组件实例发送给父组件接受,再调用

// 子组件发送事件,传本身实例
this.$emit('passpicker', this)
// 父组件接受事件
<areapicker2 @passpicker = "passpicker">
</areapicker2>
// 父组件js声明变量并接受传值
picker: any = '';
passpicker (picker: any) {
console.log(picker)
this.picker = picker;
}
// 父组件里执行子组件方法
this.picker.update();

vue中使用ts后,父组件获取执行子组件方法报错问题的更多相关文章

  1. Idea的类中使用实体类(有@Data注解)的Get/Set方法报错

    今天从svn上面下了一个maven项目,导入到Idea中之后,发现有的类会使用实体类的Set/Get方法(全报错),导致该问题的原因就是因为实体类中没有这个方法,代码类似如下: @Data publi ...

  2. vue父组件如何向子组件中传递数据?

    原文地址 props传参 父组件: <template> <parent> <child :list="list"></child> ...

  3. 九、React中的组件、父子组件、React props父组件给子组件传值、子组件给父组件传值、父组件中通过refs获取子组件属性和方法

    一.概述 React中的组件: 解决html 标签构建应用的不足. 使用组件的好处:把公共的功能单独抽离成一个文件作为一个组件,哪里里使用哪里引入. [父子组件]:组件的相互调用中,我们把调用者称为父 ...

  4. vue中父组件给子组件传值,子组件给父组件传值

    1.父组件传给子组件 父元素中 子元素中(通过props传值) 2.子组件传给父组件 子元素中(this.$emit(传过去的名字,传的参数)) 父元素中 通过changeShow的参数data 把修 ...

  5. vue父组件促发子组件中的方法

    实现在父组件中促发子组件里面的方法 子组件: <template> <div> 我是子组件 </div> </template> <script& ...

  6. 【vue】父组件主动调用子组件 /// 非父子组件传值

    一  父组件主动调用子组件: 注意:在父组件使用子组件的标签上注入ref属性,例如: <div id="home"> <v-header ref="he ...

  7. Vue 编程之路(三)—— Vue 中子组件在父组件的 v-for 循环里,父组件如何调取子组件的事件

    (标题的解决方案在第二部分) 最近公司的一个项目中使用 Vue 2.0 + element UI 实现一个后台管理系统的前端部分,属于商城类型. 一.前期思路: 其中在“所有订单”页面,UI 给的设计 ...

  8. 如何在vue中使用ts

    注意:此文并不是把vue改为全部替换为ts,而是可以在原来的项目中植入ts文件,目前只是实践阶段,向ts转化过程中的过渡. ts有什么用? 类型检查.直接编译到原生js.引入新的语法糖 为什么用ts? ...

  9. 【转】Vue组件一-父组件传值给子组件

    Vue组件一-父组件传值给子组件 开始 Vue组件是学习Vue框架最比较难的部分,而这部分难点我认为可以分为三个部分学习,即 组件的传值 - 父组件向子组件中传值 事件回馈 - 子组件向父组件发送消息 ...

随机推荐

  1. MySQL中表的复制以及大型数据表的备份教程

    MySQL中表的复制以及大型数据表的备份教程     这篇文章主要介绍了MySQL中表的复制以及大型数据表的备份教程,其中大表备份是采用添加触发器增量备份的方法,需要的朋友可以参考下 表复制 mysq ...

  2. Oracle 11g 监听很慢,由于监听日志文件太大引起的问题(Windows 下)

    现象:Windows 操作系统的Oracle 数据库,使用sqlplus 连接(不指定实例名)连接很快,程序连接或使用连接工具或在Net Manager 中测试连接都需要花费约三四十秒的时间(程序连接 ...

  3. osg model

    osg::ref_ptr<osg::Node> MyOSGLoadEarth::CreateNode() { osg::ref_ptr<osg::Group> _root = ...

  4. ES6内建对象的继承

    在ES6之前, JS是无法通过继承的方式创建属于自己的特殊数组的, 也就是说可以使用原型链来继承数组的一些方法, 但是某些返回一个数组的方法返回的值还是一个Array的实例, 例如slice, len ...

  5. web自动化01-自动化解决的问题-环境搭建-元素定位

    自动化测试 概念:由程序代码代替人工完成验证系统功能的过程 解决的问题: 回归测试 压力测试 兼容性测试 提高测试效率,提升产品质量 自动化测试分类 web自动化测试 移动自动化测试 接口自动化测试 ...

  6. C#子线程执行完后通知主线程(转)

    其实这个比较简单,子线程怎么通知主线程,就是让子线程做完了自己的事儿就去干主线程的转回去干主线程的事儿.  那么怎么让子线程去做主线程的事儿呢,我们只需要把主线程的方法传递给子线程就行了,那么传递方法 ...

  7. (十一)会话跟踪技术之作用域(request、session、servletContext)

    一.作用域范围 Request       保存的键值仅在下一个request对象中可以得到,作用于两个有请求关系的页面 Session        它是一个会话范围,相当于一个局部变量,从Sess ...

  8. 获取网卡名称及其IP地址的方法

    代码 # -*- coding: utf-8 -*- import psutil #获取网卡名称和其ip地址,不包括回环 def get_netcard(): netcard_info = [] in ...

  9. 整理Vue.js 面试题

    Vue.js 面试题整理   Vue项目结构介绍 build 文件夹:用于存放 webpack 相关配置和脚本. config 文件夹:主要存放配置文件,比如配置开发环境的端口号.开启热加载或开启gz ...

  10. 【DSP开发】利用CCS5.4开发基于DSP6455的JPEG2000图像解压缩过程

    [DSP开发]利用CCS5.4开发基于DSP6455的JPEG2000图像解压缩过程 声明:引用请注明出处http://blog.csdn.net/lg1259156776/ 说明:前端是时间基于VS ...