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

解决方案

  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. webpack4 入门配置研究

    1. 全局安装 npm install webpack webpack-cli webpack-dev-server -g 1.1)输密文的密码(电脑开机) 1.2)安装成功 2. 输入命令mkdir ...

  2. 在Nginx/Tengine服务器上安装证书

    可以从SSL证书服务控制台下载证书安装到Nginx/Tengine服务器上. 环境:以CentOS 7.Nginx 1.15.6为例. 证书名称以domain name为示例,如证书文件名称为doma ...

  3. nginx打包成rpm

    [root@localhost ~ ]#yum -y install lrzsz pcre pcre-devel zlib zlib-devel vim nrt-tools psmisc gcc gc ...

  4. AN之数据集

    一.数据集: 首先介绍数据集参数: 英文简称 英文全称 中文全称 单位 换成正常单位 说明1 说明2 Time Time 时间 小时:分钟       Temp Temperature 温度 摄氏度 ...

  5. 字符串利用%02d将月份前加0

    i = 20190104 a = 2019 b = 1 c = 4 s = "%04d-%02d-%02d" % (a, b, c)

  6. vue 中使用 lazyload 插件 数据更图片不更新 的原因 及解决方案

    在使用lazyload插件的img标签上,加上:key标识即可

  7. mysql和postgresql查询数据库中哪些表包含某个字段

    想知道数据库中哪表含有edu_status字段   mysql> select table_name,column_name from information_schema.columns wh ...

  8. java两个栈实现一个队列&&两个队列实现一个栈

    栈:先进后出  队列:先进先出 两个栈实现一个队列: 思路:先将数据存到第一个栈里,再将第一个栈里的元素全部出栈到第二个栈,第二个栈出栈,即可达到先进先出 源码: class Queue<E&g ...

  9. SCP-bzoj-1000

    项目编号:bzoj-1000 项目等级:Keter 项目描述: 鉴于该项目的奇特性质,任何拥有Administrator以下权限者均不予查看项目描述.如有违反,将导致AwD成功突破Site bzoj收 ...

  10. python 识别验证码自动登陆

    # python 3.5.0 # 通过Chrom浏览器访问发起请求 # 需要对应版本的Chrom和chromdriver # 作者:linyouyi from selenium import webd ...