在用到vue-strap的Modal组件时,会有两个默认按钮,查看官方文档配置如下:

可以看到,ok-text和cancel-text都有一个默认值,在使用时即使不给这两个选项赋值,也会显示两个默认文本的按钮。

在下面的这个例子中,我只需要一个按钮关掉模态框,这时候不能通过组件直接控制了。

查看vue-strap Modal组件的源码,可以发现Modal组件也是vue代码,所以我们可以对它进行改造。

<button v-if="cancelText!=='false' " type="button" class="btn btn-default" @click="close">{{ cancelText }}</button>

通过v-if控制cancelTex按钮是否显示,当我们传入false时,Modal组件就会只有一个按钮选项了。

功能实现!

vue-strap 修改Modal组件的更多相关文章

  1. vue中修改子组件样式

    一.问题叙述 项目里需要新添加一个表单页面,里面就只是几个select,这个几个select是原本封装好的组件,有自己原本的样式,而这次的原型图却没有和之前的样式统一起来,需要微调一下,这里就涉及到父 ...

  2. vue中修改第三方组件的样式并不造成污染

    vue引用了第三方组件, 需要在组件中局部修改第三方组件的样式, 而又不想去除scoped属性造成组件之间的样式污染. 此时只能通过>>>,穿透scoped. 但是,在sass中存在 ...

  3. vue中修改第三方组件的样式不生效

    问题 在使用element-ui时,有时候想要修改组件内的样式,但不成功,例如 <div class="test"> <el-button>按钮</e ...

  4. vue+ts修改父组件属性的写法。

    部分代码如下: 父组件:   <coupon  :modifyFlag.sync="flag" />    data() {     return {       fl ...

  5. vue.js相关UI组件收集

    内容 UI组件 开发框架 实用库 服务端 辅助工具 应用实例 Demo示例 ###UI组件 element ★9689 - 饿了么出品的Vue2的web UI工具套件 Vux ★6927 - 基于Vu ...

  6. vue 子组件修改父组件传来的props值,报错

    vue不推荐直接在子组件中修改父组件传来的props的值,会报错 [Vue warn]: Avoid mutating a prop directly since the value will be ...

  7. vue scoped 穿透_vue 修改内部组件样式问题

    何为scoped? 在vue文件中的style标签上,有一个特殊的属性:scoped.当一个style标签拥有scoped属性时,它的CSS样式就只能作用于当前的组件,也就是说,该样式只能适用于当前组 ...

  8. vue组件中,iview的modal组件爬坑--modal的显示与否应该是使用v-show

    这是我第一次写博客,主要是记录下自己解决问题的过程和知识的总结,如有不对的地方欢迎指出来! 需求:点击btn,弹出modal显示图表(以折现图为例) 这应该是很基本的需求也是很容易实现的,代码和效果如 ...

  9. vue组件中的样式属性:scoped,解决在父组件中无法修改子组件样式问题

    Scoped CSS规范是Web组件产生不污染其他组件,也不被其他组件污染的CSS规范. vue组件中的style标签标有scoped属性时表明style里的css样式只适用于当前组件元素,它是通过使 ...

随机推荐

  1. enum枚举类型

    枚举类型的实例是常量,且它们都用大写字母表示. 简单枚举例子: public enum Spiciness { NOT, MILD, MEDIUM, HOT, FLAMING } public cla ...

  2. Scrapy笔记:CrawSpider中rules中的使用

    scrapy.spiders.crawl.CrawlSpider类的使用 这个类比较适用于对网站爬取批量网页,相比于Spider类,CrawlSpider主要使用规则(rules)来提取链接 rule ...

  3. AC日记——银河英雄传说 codevs 1540

    1540 银河英雄传说 2002年NOI全国竞赛  时间限制: 1 s  空间限制: 256000 KB  题目等级 : 大师 Master 题解       题目描述 Description 公元五 ...

  4. iOS YYYY 和 yyyy的区别

    2017年1月31日 转换后变成 2018年1月31日,相差一年.这是为什么呢? 原因:YYYY 是以周为单位计算的,我们平常计算日期时最好用yyyy,yyyy才是标注的年份 如果一月1日是星期一,星 ...

  5. PHP生成随机码

    前几天,做了个小小的实验,生成了一组数据,数据要求是包含1000个元素,每个元素为10个随机的数字加字母的组合. 嗨呀,说写就写,然后用for循环生成了一组数据,看起来还不错,先把代码贴上来. //随 ...

  6. Guava源码学习(零)前言

    Guava是由Google出品的Java类库,功能强大且易用. 后续我会用多篇博客介绍Guava的使用方法,以及从源码层面分析其实现原理. 分析次序基于Guava的官方Wiki 基于版本:Guava ...

  7. HDU 1223 还是畅通过程【最小生成树模板】

    还是畅通工程 Time Limit: 4000/2000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)Total Subm ...

  8. BZOJ2870—最长道路tree

    最长道路tree Description H城很大,有N个路口(从1到N编号),路口之间有N-1边,使得任意两个路口都能互相到达,这些道路的长度我们视作一样.每个路口都有很多车辆来往,所以每个路口i都 ...

  9. Beginning Auto Layout Tutorial in iOS 7: Part 4

    A little runtime excursion 为两个button都添加同一个ibaction方法在viewcontroller.m中实现如下的方法:

  10. novell.directory.ldap获取邮箱活动目录

    在windows系统上可以使用下列方法来查找所有的员工邮箱和员工组: StringDictionary ReturnArray = new StringDictionary(); Dictionary ...