随笔分类 - Vue
摘要：1.vue代码 <template> <el-table @selection-change="handleSelectionChange" @sort-change="sortChange" v-loading="loading" id = "TableColumnID" element-load
阅读全文
摘要：<a-upload slot="extra" name="file" :multiple="true" :showUploadList="false" :beforeUpload="beforeUpload" :customRequest="uploadFile"> <a href="javascr
阅读全文
摘要：转载出处： https://www.cnblogs.com/mmzuo-798/p/9273754.html 最近公司把云平台产品用vue 前后端分离的框架来写，前面大部分开发都比较顺利，后面打包部署出了bug 现在记录下自己遇到的哪些坑 1，我直接npm run build 打包出来，打开dist
阅读全文
摘要：想实现的效果 实现方法 <el-autocomplete v-model="detail.CUSTOMER_NAME" :fetch-suggestions="querySearchAsync" @select="handleSelect" placeholder="请输入内容"></el-auto
阅读全文
摘要：import ElementUI from 'element-ui' import 'element-ui/lib/theme-chalk/index.css' import locale from 'element-ui/lib/locale/lang/zh-CN' // en是英文 zh-CN是
阅读全文
摘要：在项目中提取了一个公共的头部、脚部组件 <template> <div id="app"> <Header></Header> <router-view/> <Footer></Footer> </div> </template> <script> import Header from "./com
阅读全文
摘要：在前后端分离vue作为前端框架，在使用服务器接口时面临的第一个问题就是跨域。本文涉及内容仅保证在vue-cli3.0脚手架创建的项目中、及本地调试中有效（使用之前版本脚手架创建的项目请自行转换），本文内容不适用于服务器端前后台打包部署。 一、处理跨域接口调用 1、在项目根目录下建立vue .conf
阅读全文
摘要：// 在el-select上加上 :no-data-text=" 'No Data' <el-select class="filterselect" :no-data-text=" 'No Data' " v-model="value1" @change="changezzs(value1)" st
阅读全文
摘要：这篇文章主要介绍下vue-cli3.0项目搭建，项目结构和配置等整理一下，分享给大家。 一、介绍 Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统。有三个组件： CLI：@vue/cli 全局安装的 npm 包，提供了终端里的vue命令（如：vue create 、vue serve
阅读全文
摘要：遇到这种情况呢，一般是你没有完整安装的，你应该安装 npm i -g vue-cli 1.输入 npm config list 查看目录 找到 prefix 目录下对应的地址 然后在该目录看是否有Vue的相关执行文件 如果有的话执行 vue --version vue -V vue-cli --ve
阅读全文
摘要：一、什么是localStorage 对浏览器来说，使用 Web Storage 存储键值对比存储 Cookie 方式更直观，而且容量更大，它包含两种：localStorage 和 sessionStorage sessionStorage(临时存储) ：为每一个数据源维持一个存储区域，在浏览器打开期
阅读全文
摘要：项目中遇到的需求: 输入框默认获取焦点,回车后选中文本信息 <input ref="code" type="text" @keyup.enter="enterPress()" v-model="code"/> export default { data() { return { code:'', }
阅读全文
摘要：场景 要实现的效果是 那么就要用到怎样将这个el-table清空，即在vue中怎样将数组清空。 实现 首先将这个el-table与一个数组实现双向绑定 <el-table v-loading="loading" :data="bcglXiangXiList" :row-class-name="row
阅读全文
摘要：场景 使用el-table进行数据的展示时，某些列不需要展示，但是需要其存在。 比如查询数据时要获取对象的ID属性，在展示时不需要展示ID这一列， 但是在进行编辑时需要获取该ID。 实现 可以通过在el-table-column上添加 v-if="false" 来实现 完整示例代码 <el-tabl
阅读全文
摘要：1、用法不对 要想this.$refs['form'].resetFields()方法有效，必须配置el-form :model 属性和el-form-item中的prop属性，才可以。 2、坑1 在还没有显示对话框之前就调用this.$refs['form'].resetFields()，会报错。
阅读全文
摘要：效果 代码实现 <template> <div class="app"> <el-form ref="form" :model="form"> <el-form-item label="手机品牌"> <el-select v-model="form.phoneBrand" placeholder="
阅读全文
摘要：1、父子组件传参： 在app.vue文件里引入公共的header 和 footer <template> <div id="app"> <el-header v-if="header_show"></el-header> <router-view v-on:public_header="public
阅读全文
摘要：list就是你获取的数据数组 computed:{ sortlist(){ return this.sortlist.sort((a, b) => { return a['value'].localeCompare(b['value']) //value是list你需要索引的字段名称 }) } }
阅读全文
摘要：先上效果图： 然后直接上代码： <!-- 其他代码省略 --> <el-table :data="tableData" v-loading:loading border style="width: 100%"> <el-table-column prop="fileName" label="文件名"
阅读全文
摘要：转载出处:https://blog.csdn.net/qq_39692256/article/details/81909708 el-select组件官方实例中只能通过value绑定传递一个参数 在有些使用场景中需要同时用到对象中的两个参数（id和name） 首先想到的是同时绑定这两个参数，一起传递
阅读全文
