在用到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. [LeetCode] Length of Last Word 字符串查找

    Given a string s consists of upper/lower-case alphabets and empty space characters ' ', return the l ...

  2. PE文件格式---节和节表

    17.1.4  节表和节 从排列位置来看,PE文件在DOS部分和PE文件头部分以后就是节表和多个不同的节(如图17.1中的③和④所示).要理解什么是节表,什么是节以及它们之间的关系,那就首先要了解Wi ...

  3. Heritrix3.0.0启动介绍

    下面开始使用Heritrix3.0.0 进 入CMD(开始->运行),进入Heritrix3.0.0所在目录,我这里是D:/heritrix/heritrix3.0.0/bin,这里 大家截图也 ...

  4. ext2/3/4的inode结构说明

    系统环境:Ubuntu15.10/ext4 今天在复习<鸟哥的私房菜-基础学习篇>,看到inode大小为128bytes,想看下这128字节里面到底是什么样的. 于是我查了下google, ...

  5. Building MFC application with /MD[d] (CRT dll version)requires MFC shared dll version

    解决方法:

  6. AC日记——传染病控制 洛谷 P1041

    传染病控制 思路: 题目想问的是: 有一棵树: 对于除1外每个深度可以剪掉一棵子树: 问最后剩下多少节点: 题目意思一简单,这个题立马就变水了: 搜索就能ac: 数据有为链的情况,按深度为层次搜索的话 ...

  7. AC日记——[Sdoi2010]星际竞速 bzoj 1927

    1927 思路: 连边,拆点: 每个点拆成i,i+n,都向t连边: i到t表示高速模式,i+n到t表示跳跃模式: 然后读入路径,如果u>v,则交换u,v: u向v+n连边: spfa跑最小费用: ...

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

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

  9. HDU 5242 Game(树上贪心)

    题目链接 Game 题目的意思很简单, 就是要找一棵树权值最大等等前K条链. 在本题中,走的次数等于min(叶子结点个数,k) tree[i].sum意为从i号结点出发走到某个叶子结点能得到的最大总价 ...

  10. 关于asp.netCore3.0区域和路由配置

    在ASP.NET Core 3.0中路由配置和2.0不一样了 一.MVC 服务注册 ASP.NET Core 3.0 添加了用于注册内部的 MVC 方案的新选项Startup.ConfigureSer ...