在用到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. centOS 7 安装java sdk 并测试是否安装成功

    CentOS 6.X 和 7.X 自带有OpenJDK runtime environment  (openjdk).它是一个在linux上实现开源的Java 平台. 安装方式: 1.输入以下命令,以 ...

  2. 刷leetcode是什么样的体验?【转】

    转自:https://www.zhihu.com/question/32322023 刷leetcode是什么样的体验? https://leetcode.com/ 1 条评论   默认排序 按时间排 ...

  3. Linux定时关机

    sudo shutdown -h +120 :两小时后关机sudo shutdown -h 23:00 :表示在23点定时关机 一.shutdown命令关机 各参数功能: -c 取消前一个shutdo ...

  4. 将Map<String, List<Map<String,Object>>>进行排序

    首先我贴上我的代码,刚开始我也不知道怎么排序还写了一些方法,最后请教群里的大神解决了 public Map<String, List<Map<String,Object>> ...

  5. 使用aspnet_regsql.exe 创建ASPState数据库,用来保存session会话

    使用aspnet_regsql.exe 创建ASPState数据库,用来保存session会话   因为公司有多台服务器,所以session要保存在sql server上,因此要在数据库中建立存放se ...

  6. 深入理解 JavaScript Function

    1.Function Arguments JavaScript 函数的参数 类型可以是 复杂类型如  Object or Array 和简单类型 String Integer null undefin ...

  7. 初学React,setState后获取到的thisstate没变,还是初始state?

    问题:(javascript)初学React,setState后获取到的thisstate没变,还是初始state?描述: getInitialState(){ return {data:[]}; } ...

  8. innodb事务锁

    计算机程序锁   控制对共享资源进行并发访问 保护数据的完整性和一致性   lock  主要是事务,数据库逻辑内容,事务过程 latch/mutex 内存底层锁:   更新丢失 原因: B的更改还没有 ...

  9. xamarin.from ToolbarItem 字体大小和颜色更改

    在xamarin.from 上我们经常会使用到页面跳转方式, new NavigationPage(newp page()){ BarBackgroundColor=Color.FromHex(&qu ...

  10. 分治法寻找第k大的数

    利用快速排序的思想·去做 #include<iostream>using namespace std;int FindKthMax(int*list, int left, int righ ...