正常情况下，子组件应该尽量减少业务逻辑，而应该将业务逻辑放到父组件里面，从而减少耦合，但是当 我们不得不用到这种情况时，可以采用下面的思路

解决方案

  1. 尽量将请求单独作为一个函数（不要将请求放到show()函数里面，show()函数只是负责组建的显示）；

  2. 在进行请求的时候可以加入loading，提高体验；

  3. 当请求完毕以后，再通过this.$emit通知父组件请求完毕；

  4. 父组件这时在通过this.$refs.child.show() 显示子组件，同时隐藏自己；

基于vue，通过父组件触发子组件的请求，等请求完毕以后，显示子组件，同时隐藏父组件的更多相关文章

  1. vue.js中父组件触发子组件中的方法

    知识点:vue.js中,父组件的method中,触发子组件中的方法,获得子组件中的定义的属性 (1)子组件 : child_crud.js var html_child_crud= "< ...

  2. vue 父组件使用keep-alive和infinite-scroll导致在子组件触发父组件的infinite-scroll方法

    (vue.js)vue 父组件使用keep-alive和infinite-scroll导致在子组件触发父组件的infinite-scroll方法”问题疑问,本网通过在网上对“ (vue.js)vue ...

  3. vue-property-decorator和typescript结合构建的class类组件，父组件触发子组件方法的方式

    vue-property-decorator和typescript结合构建的class类组件,父组件触发子组件方法的方式 class类组件示例 Father类组件 <template> & ...

  4. React 父组件触发子组件事件

    Parent组件 import React from "react"; import Child from "./component/Child"; class ...

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

    网上找了几种方法,下面这两种最实用,最明了 方法一:父组件方法返回是字符串或数组时用这种方法 子组件: <template> <button @click="submit& ...

  6. 基于Vue的数字输入框组件开发

    1.概述 Vue组件开发的API:props.events和slots 2.组件代码 github地址:https://github.com/MengFangui/VueInputNumber 效果: ...

  7. 基于Vue开发的tab切换组件

    github地址:https://github.com/MengFangui/VueTabSwitch 1.index.html <!DOCTYPE html> <html lang ...

  8. 发布自己第一个npm 组件包（基于Vue的文字跑马灯组件）

    一.前言 总结下最近工作上在移动端实现的一个跑马灯效果,最终效果如下: 印象中好像HTML标签的'marquee'的直接可以实现这个效果,不过 HTML标准中已经废弃了'marquee'标签 既然HT ...

  9. 使用webpack4搭建一个基于Vue的组件库

    组内负责的几个项目都有一些一样的公共组件,所以就着手搭建了个公共组件开发脚手架,第一次开发 library,所以是参考着 iview 的配置来搭建的.记录如何使用webpack4搭建一个library ...

随机推荐

  1. Async await 异步编程说明

    希望在编程上有些许提高所以 最近连续2篇博客都在说明多线程和异步编程的使用,异步和多线程之间区别请自行百度,因为理解不是特别透彻就不在叙述以免误导大家,这里写下新研究整理 task  和 await ...

  2. MySQL数据库 -- Navicat、pycharm连接数据库

    内容目录 1.Navicat使用 2.pycharm使用数据库 一.Navicat使用 #1. 测试+链接数据库 #2. 新建库 #3. 新建表,新增字段+类型+约束 #4. 设计表:外键 #5. 新 ...

  3. ros语音交互（五）移植科大讯飞语音识别到ros

    将以前下载的的语音包的 samples/iat_record/的iat_record.c speech_recognizer.c speech_recognizer.c 拷贝到工程src中, linu ...

  4. vSphere ESXi如何使用嵌套虚拟化（1-vSphere 6.0+linux虚拟化）

    今天准备在vSphere当中上传一个用workstation做出来的虚拟机,没想到遇到了很多问题,在这里,作为新手小白碰到了一些问题,在这里总结一下. 1.workstation做出来的虚拟机直接上传 ...

  5. js 购物车的数量加减，对应的总价也随机变化

    html相关的源码: <div class="goods_num clearfix"> <div class="num_name fl"> ...

  6. 通过网络socket获取对方 ip 和port

    int getpeername(int s, struct sockaddr *name, socklen_t *namelen);描述获取socket的对方地址struct sockaddr_in ...

  7. Download Blackarch Linux

    https://www.blackarch.org/

  8. thinkphp 日志驱动

    日志驱动默认的命名空间位于Think\Log\Driver,驱动类需要实现的接口方法包括: 方法 说明 架构方法 __construct($config=array()) 写入方法 write($lo ...

  9. Python 爬取12306火车票

    获取火车站 stations.py #import certifi #import urllib3 import re import requests from pprint import pprin ...

  10. NX二次开发-将工程图视图+尺寸的最大边界导出图片

    /***************************************************************************** ** ** ExportPicture.c ...