在实际开发中一般有两种封装vue组件的方法:一种就是常用的的通过props父组件传值给子组件的方法:

  子组件

  

父组件:

 

还有一种就是通过调用api的形式,下面例子是本人在实际项目中封装的一个自定义图标的弹窗组件

首先实现组件的UI页面(css部分截图不完整)

在vue文件的同目录下新建alertTips.js文件

页面中调用方法:

如何封装使用api形式调用的vue组件的更多相关文章

  1. python下以api形式调用tesseract识别图片验证码

    一.背景 之前在博文中介绍在python中如何调用tesseract ocr引擎,当时主要介绍了shell模式,shell模式需要安装tesseract程序,并且效率相对略低. 今天介绍api形式的调 ...

  2. C++模板封装Win32 API 动态调用

    起因 花两周通读了一遍<C++ Primer>,积攒的疑惑一扫而光. 前因 利用C++11可变模板,封装调用dll导出函数 本以为已经很好用了,最近抽时间巩固下知识体系,发现自己道行不够! ...

  3. 封装Vue组件的一些技巧

    封装Vue组件的一些技巧 本文同步在个人博客shymean.com上,欢迎关注 写Vue有很长一段时间了,除了常规的业务开发之外,也应该思考和反思一下封装组件的正确方式.以弹窗组件为例,一种实现是在需 ...

  4. vue中Axios的封装和API接口的管理

    前端小白的声明: 这篇文章为转载:主要是为了方便自己查阅学习.如果对原博主造成侵犯,我会立即删除. 转载地址:点击查看 如图,面对一团糟代码的你~~~真的想说,What F~U~C~K!!! 回归正题 ...

  5. html5音频audio对象封装成vue组件的方式调用以及setTimeout如何在vue2生效 (vue2正在熟悉中,ajax还是用jQuery来写舒服些,里面含有一些php写法可略过) 此网页应用在PC不考虑手机端

    // vue2 组件封装如下: <template> <div> <div><!--vue element 组件的引用 Switch 开关 不懂请自行百度(重 ...

  6. spring cloud eureka + feign,api远程调用

    网上教程不少,有些就是复制粘贴,不结合实际生产. eureka不再阐述. 一般正常开发会有多个工程,且多个module. 我的习惯是: eureka server.权限.config.gateway ...

  7. vue2.0 如何自定义组件(vue组件的封装)

    一.前言 之前的博客聊过 vue2.0和react的技术选型:聊过vue的axios封装和vuex使用.今天简单聊聊 vue 组件的封装. vue 的ui框架现在是很多的,但是鉴于移动设备的复杂性,兼 ...

  8. Vue组件的定义、注册和调用

    <!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>组 ...

  9. 简单封装axios api

    可以在代码逻辑中写axios请求,处理请求结果,但是随着项目越来越大,代码会很繁琐,不容易维护,所以,可以把一些在所有请求中都要处理的逻辑抽取出来,封装成api方法.比如每次请求中都要判断是否有权限, ...

随机推荐

  1. 洛谷P4051 [JSOI2007]字符加密 后缀数组

    题目链接:https://www.luogu.org/problemnew/show/P4051 思路:我们联想求后缀数组sa的过程,发现我们在求y数组的时候(第二关键字,下标为第二关键字的排位,值为 ...

  2. Crane (POJ 2991)

    //线段树 延迟标签 // #include <bits/stdc++.h> using namespace std; const int maxn=1e4+5; double x[max ...

  3. 项目总结22:Java UDP Socket数据的发送和接收

    项目总结22:Java UDP Socket数据的发送和接收 1-先上demo 客户端(发送数据) package com.hs.pretest.udp; import java.io.IOExcep ...

  4. spring mvc 映射与适配器

    在深入学习Spring mvc 过程中,我们需要了解如下两个类: org.springframework.web.servlet.mvc.method.annotation.RequestMappin ...

  5. Odoo 堆积木似的软件构建

    七雄争霸秦国一统天下,统一货币度量衡,从此天下统一... 假设在未来的某天,有一款开源的系统平台能将国内的企业管理软件市场进行统一,规范市场,标准开发,所有系统的集成创建通过市场开放的应用独立安装搭建 ...

  6. yum 安装时遇到“UnicodeDecodeError: 'ascii' codec”的问题

    今天新安装了一个6.9系统,配置好本地yum源后,用yum安装时报了以上的错误信息,在/etc/yum.repos.d/目录下多出了TTT的一个目录 (手动问号),在百度上查了一些文档. 解决方法:1 ...

  7. CentOS 7 minimal网络配置

    centos最小化安装没有ifconfig命令,可以使用  ip addr  查看网络信息,习惯ifconfig的用户,则使用 yum -y install net-tools 即可 ; 如果yum不 ...

  8. Java发送手机短信(附代码和解析,亲测有效,简便易操作)

    这个方法用的是中国网建SMS短信通相关依赖进行操作的~~ 很简单,仅需要三步,第二部代码直接复制,不需要修改,第三部中的用户名和密钥修改成自己的即可 <1> 首先需要导入三个jar包 &l ...

  9. STS中applicationContext.xml配置文件

    <?xml version="1.0" encoding="UTF-8"?> <beans xmlns="http://www.sp ...

  10. day31并发

    以后你为之奋斗的两点: 提高cpu的利用率 提高用户的体验  1.纯概念/纯方法 操作系统的发展历程 #主要的人机矛盾是什么:CPU的使用率 #输入\输出数据和CPU计算没有关系 #操作系统是怎么进化 ...