美文网首页Vue
element-ui利用props特性来全局初始化默认配置

element-ui利用props特性来全局初始化默认配置

作者: littlesunn | 来源:发表于2020-08-10 10:25 被阅读0次

在做大型项目时,我们肯定需要统一的样式,比如按钮的统一大小(size="mini"),比如表格的每一列内容居中(align="center"),只要是element提供了这个属性,我们都可以统一配置,并且不影响其在子页面的中单独再修改.
首先我们新建一个比如叫element_default_props.js的文件

import Vue from 'vue'; // 引入vue
import ElementUI from 'element-ui';
//先打印一下ElementUI,点进去看看各个组件的默认的props
console.log(ElementUI, "我是饿了么");

//这里通过修改dialog的props里的默认值,弹出框设置点击蒙版不关闭
ElementUI.Dialog.props.closeOnClickModal.default = false;

//有些props 属性设置default不生效,需要这样:
ElementUI.Table.props.stripe =  {
    type: Boolean,
    default: true
} //表格的斑马线条纹

//还有比如default是个方法
ElementUI.Table.props.cellStyle = { //表格头部样式
    default: () => ({
        'color': '#333'
    }),
};

大致就是以上几种配置方法,前提是element提供了这些props 属性,大部分是有的,所以不必担心.
利用这个思路,其实你自己写的组件也是可以在created里面通过修改props来达到初始化的效果.

相关文章

  • element-ui利用props特性来全局初始化默认配置

    在做大型项目时,我们肯定需要统一的样式,比如按钮的统一大小(size="mini"),比如表格的每一列内容居中(a...

  • React设置默认props

    转自Kindem的博客 如何初始化props 在ES6类中,我们使用defaultProps来设置props的默认...

  • git 创建仓库和克隆仓库

    全局配置用户名 全局配置邮箱 初始化仓库 克隆仓库

  • 「Redis源码解读」—数据库(一)启动

    Redis启动总体上可以分为如下几步: 1.初始化全局服务器配置 加载配置文件(如果指定了配置文件,否则使用默认配...

  • React-Native 生命周期

    实例化 ============= 组件类型首次**实例化时初始化默认props属性,多实例共享 实例化时初始化默...

  • react 组件生命周期

    相关函数 getDefaultProps 设置默认props,只调用一次 getInitialState 初始化每...

  • npm 笔记

    更新 npm 版本 -g 表示安装到全局目录。 npm 初始化 -y 表示所有配置选项使用默认值。 该命令会在目标...

  • NSQD 源码分析

    启动流程 利用 svc 创建一个常驻进程 读取配置,优先级:命令行、配置文件、默认配置 实例化 nsqd,初始化日...

  • 20200816

    Vue全局API汇总 全局配置 Vue.config 是全局配置对象。 silent 默认false,是否取消Vu...

  • Maven 使用指定 Java 版本编译项目

    全局配置 全局配置是指在${MAVEN_HOME}\conf\settings.xml中进行配置,如果默认新建项目...

网友评论

    本文标题:element-ui利用props特性来全局初始化默认配置

    本文链接:https://www.haomeiwen.com/subject/mhvddktx.html