随笔分类 - Element-UI
摘要：步骤 创建 language文件夹 在src同级的目录下新建language文件夹,新增三个文件，代码如下 index.js import Vue from 'vue' import VueI18n from 'vue-i18n' Vue.use(VueI18n) // 引入各个语言配置文件 imp
阅读全文
摘要：需求 表头的标题内容过长时在一行内显示，不换行。 实现 // table.config.js const tableConfig = { // 设置列 columns: [ { prop: 'date', label: '日期as', width: '180', // 设置固定列 fixed: tr
阅读全文
摘要：背景 我们平常工作中需要用表格的形式来展示多行数据 需求 需求1：通过配置文件的形式来设置表格的列 需求2：可以合并表头 代码 MyTable.vue <template> <div> <el-table :data="tableData" style="width: 100%" stripe :h
阅读全文
摘要：背景 在管理系统中我们需要经常使用表单组件来收集用户的一些数据，如果按照官网的示例一个个表单项去填写不仅代码会变得很长而且麻烦，所以我们有必要去对组件进行再次的封装 需求 需求1：表单项通过配置文件配置 表单的类型、key、label、是否必填 示例 MyForm.vue <template> <d
阅读全文
摘要：背景 有的时候我们需要在表单中携带一些上传的附件传给服务器 搭建基本表单结构 <template> <div> <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleF
阅读全文
摘要：背景 在我们上传文件后我们希望点击文件实现预览效果进行确认或者其他操作。 方式1：可以使用element-ui的upload组件+dialog+image组件解决,示例代码如下： <el-upload action="http://127.0.0.1:8888/api/private/v1/uplo
阅读全文
摘要：背景描述 公司给的界面是如下效果，但是使用了elment-ui的多行合并时会遇到表格头部内容的设计出的二级表头，不符合我的需求。 官网和期望效果对比： 合并中间的表头（不是首尾） 注意：适用于表头中间的合并 步骤： 为el-table标签上的 header-cell-style 属性绑定回调函数 跨
阅读全文
摘要：描述 使用Cascader 级联选择器的组件来跑项目的时候发现高度和位置存在问题 相关代码如下： Cate.vue中HTML结构： <el-form :model="shopCateForm" :rules="shopCateFormRules" ref="shopCateFormRef" labe
阅读全文
