vue 父组件调用子组件内置方法
背景介绍:外派到泰康做项目。这个项目中有个选择组织的功能,是一个树桩结构的懒加载,于是我就element-ui的tree组件封装了一个公共的组件。
但是后来发现他们的公司组织结构不是都请求的同一个接口,于是想着组件里面给加个url参数就可以了。但是他们的人员说一些参数数据都不同,
非要我在请求接口时在每个页面的父组件分别调用。我想着你们不觉得麻烦我也OK啦。然后就遇到了需要在父组件调用子组件方法的问题。
tree组件有个load 方法,我们要做的是在父组件能调用这个方法,并将他的默认参数node和resolve传过去
<el-tree
v-show="isShowTree"
class="bgClFFF treeBox"
ref="selectTree"
:data="treeData"
node-key="label"
accordion
:props="defaultProps"
@node-click="handleNodeClick"
:expand-on-click-node="false"
lazy
:load="loadNodeChild"
:render-content="renderContent"
></el-tree>
解决的方法如下:
子组件props里定义一个方法,用于接受父组件传过来的方法
props: {
loadNode: {
type: Function,
default: ""
},
}
methods里子组件触发加载数据方法时,调用父组件的方法,并将参数传过去
// 父组件调用
然后在父组件的methods里调用这个方法
vue 父组件调用子组件内置方法的更多相关文章
- vue+element ui项目总结点(四)零散细节概念巩固如vue父组件调用子组件的方法、拷贝数据、数组置空问题 等
vue config下面的index.js配置host: '0.0.0.0',共享ip (假设你的电脑启动了这个服务我电脑一样可以启动)-------------------------------- ...
- vue:父子组件间通信,父组件调用子组件方法进行校验子组件的表单
参考: ElementUI多个子组件表单的校验管理:https://www.jianshu.com/p/541d8b18cf95 Vue 子组件调用父组件方法总结:https://juejin.im/ ...
- Vue 父组件调用子组件的方法
qwq 前两天看了下vue,父子组件方法的调用,怕忘记,所以做个小记录. 一.父组件调用子组件的方法 1.父组件 <template> <div id="rightmen ...
- vue父组件调用子组件方法、父组件向子组件传值、子组件向父组件传值
一.父组件调用子组件方法 父组件代码 parent.vue <template> <div> <button @click="parentFun" ...
- vue中子组件调用父组件里面的数据和方法 父组件调用子组件的数据和方法
1.子组件直接调用父组件的数据和方法 在父组件father,vue <template> <div> <!-- 父组件里面的数据 --> <p>父组件里 ...
- Vue3 父组件调用子组件的方法
Vue3 父组件调用子组件的方法 // 父组件 <template> <div> 父页面 <son-com ref="sonRef"/> < ...
- react 父组件调用子组件方法
import React from 'react'import '../page1/header.css'import { Table } from 'antd'import Child from ' ...
- 父组件调用子组件 viewChild
父组件调用子组件 1.在子组件的ts中声明一个变量 public lineout:any="你好,我是被父组件调用的子组件"; 2.在父组件的html中写入 (引入子组件) & ...
- React 父组件调用子组件的方法
父组件调用子组件的方法 React v16.3.0 及以后版本使用 import React, {Component} from 'react'; export default class Paren ...
随机推荐
- springboot整合微软的ad域,采用ldap的api来整合,实现用户登录验证、
流程: 1.用户调登录接口,传用户名和密码2.用户名和密码在ad验证,验证通过后,返回当前用户的相关信息.(注:ldap为java自带的api不需要maven引入其他的)3.根据返回的用户信息,实现自 ...
- 基础作业 本周没上课,但是请大家不要忘记学习。 本周请大家完成上周挑战作业的第一部分:给定一个整数数组(包含正负数),找到一个具有最大和的子数组,返回其最大的子数组的和。 例如:[1, -2, 3, 10, -4, 7, 2, -5]的最大子数组为[3, 10, -4, 7, 2] 输入: 请建立以自己英文名字命名的txt文件,并输入数组元素数值,元素值之间用逗号分隔。 输出 在不删除原有文件内容
1丶 实验代码 #include<stdio.h> int main(void) { int tt,nn,i,j,c[11][11]; int flag=1; scanf("%d ...
- docker安装,err:exit status 255,提示找不到虚拟机IP
我遇到这个问题是因为,BIOS没有打开虚拟化技术,导致虚拟机无法成功创建,自然找不到IP. 解决: 1.进入BIOS,高级选项卡下,找到虚拟化技术开关,打开即可.具体做法,可搜网文. 2.删除原来自动 ...
- Visual Stdio 2017增加SVN支持
实验目的 当前公司项目源码文档等内容都保存在svn上,现在是用着小乌龟在文件浏览状态中去检出和提交等操作,没有集成到vs2017中来,比较麻烦.现在要把vs2017增加svn支持,希望可以直接在IDE ...
- SQL SERVER数据库附加是只读的解决方法
使用sa登录SQL Server2008附加数据库,附加之后数据库为只读的, 点数据库-->“属性”-->“选项”-->“状态”, 发现“数据库为只读”这一项为True,改为fals ...
- webpack 4.0 配置文件 webpack.config.js文件的放置位置
一般webpack.config.js是默认放在根目录的,不在根目录的时候需要在package.json中制定位置,我的配置文件目录是config/webpack.config.js,在package ...
- tensorflow(3)可视化,日志,调试
可视化 添加变量 tf.summary.histogram( "weights1", weights1) # 可视化观看变量 还有添加图像和音频. 常量 tf.summary.sc ...
- Windows 2008 r2上安装MySQL
用MSI安装包安装 根据自己的操作系统下载对应的32位或64位安装包.按如下步骤操作: MySQL数据库官网的下载地址http://dev.mysql.com/downloads/mysql,第一步: ...
- JavaScript与java差异
- Vue相关开源项目库汇总
https://github.com/opendigg/awesome-github-vue http://www.opendigg.com/tags/front-vue README.md 内容 U ...