
Vue.js
yjxfox
享受生活创意设计,创意产品,创意家居,创意广告,创意图片,网页设计,摄影作品,包装设计,引导视觉创意,为设计师们提供更好的信息平台。
展开
-
vuejs el-pagination 分页数据渲染
<!-- 分页 --><div class="pagination" v-if="totality*pageSizeCount > 1" :class="{'dn':this.totality <= 1}"> <el-pagination background @current-change="handleCurrentChange" :current-page="pageNum" :total="totality" layout="total, pre.原创 2021-03-09 10:24:34 · 522 阅读 · 1 评论 -
vue 导出文件携带请求头token
前言本文并不能直接复制到本地看效果,仅提供代码参考1.使用axios的方式携带请求头token2.设置响应的数据类型responseType: "blob"13.请求成功,返回二进制文件的数据回来4.请求失败,返回json5.示例代码<template> <div> <el-button type="primary" size="small" :loading="btnLoading" @click="exportFile">导出&转载 2021-03-08 14:30:23 · 950 阅读 · 1 评论 -
element table查询时,table内显示加载中,返回空数据时显示暂无数据(即empty-text的使用)
1.先来看下table内empty-text的含义2.转载 2020-12-16 16:38:02 · 3221 阅读 · 0 评论 -
element table 表格实现上移、下移
业务场景:有时候需要前端实现上移和下移功能代码如下:根据交互形式,我这里是把第一条数据的上移按钮置灰不可点击::disabled="scope.$index == 0";最后一条数据下移按钮置灰不可点击::disabled="(scope.$index + 1) == tableData.length"。<template> <el-table :data="tableData"> <el-table-column ty转载 2020-12-15 17:40:46 · 3533 阅读 · 0 评论 -
Vuejs 用router-link跳转带参数到下一个页面
在当前页面设置router-link<router-link class="normalBtn" tag="a" :to="{name:'historyRecordId',params: {id:radio}}" >下一步</router-link>然后在下一个页面接收上一个页面带过来的参数<script>export default { ...原创 2019-05-29 11:15:22 · 3022 阅读 · 0 评论 -
Vuejs style lang="scss" 样式里写背景图片路径
主要是在引入背景图片的前面加入“ ~@/assets/ ”<style lang="scss"> div{ height:600px; background-size:100%; background-repeat:no-repeat; background-position:center top; ...原创 2019-05-29 09:37:10 · 6634 阅读 · 2 评论 -
Vuejs 实现Element - tableData 列表排序上下移动
el-tabel 列表项实现上移,下移,删除功能结合Element组件,scope中有三个参数(row,cow,$index)分别表示行内容、列内容、以及此行索引值,table上绑定数组 :data=“newsList”。上移和下调两个按钮,并绑定上点击函数,将此行的索引值(scope.$index)作为参数:<template> <el-table ...转载 2019-05-28 16:24:13 · 2458 阅读 · 0 评论 -
Vue 中安装使用vue-quill-editor富文本编辑器
1、安装依赖npm install vue-quill-editor --save2、使用(1)在“项目名\src\main.js”引入import VueQuillEditor from 'vue-quill-editor'//一定要引入这三个css,不然文本编辑器会出现不规则黑白几何图形//这三个css可以在main.js中引入,也可以在具体使用的.vue文件中引入impo...转载 2019-05-13 11:48:56 · 3232 阅读 · 0 评论 -
Vue.js element-ui date-picker日期选择后格式化为yyyy-mm-dd格式
项目中需要的日期格式为yyyy-mm-dd,但是我们在使用的element-ui的 日期选择器后默认的时间格式为Fri Sep 07 2018 00:00:00 GMT+0800 (中国标准时间)折腾了半天找到一种完美的方法,这记载datepicker中添加一句value-format=”yyyy-MM-dd” 即可,以下这样:<el-date-picker v-model=...原创 2019-05-16 17:18:13 · 3280 阅读 · 0 评论 -
Vuejs element table 表格添加,删除
Html 部份<el-table :data="tableData" style="width: 100%"> <el-table-column type="index" label="排序" min-width="20"> </el-table-column> ...原创 2019-05-24 18:34:13 · 419 阅读 · 0 评论 -
Vue.js 和 ECharts 封装的图表组件库v-charts
1. 命令安装npm i v-charts echarts -S2. 在显示的页面进行参数配置<template> <div> <ve-line :data="chartData"></ve-line> </div></template><script>import VeLi...原创 2019-05-15 14:23:28 · 1146 阅读 · 0 评论 -
在vue.js中如何导出Excel表格
有一个项目需求,要求在前端项目中导出Excel表格,经过查找代码,Vue.js确实可以实现,具体实现步骤为:1. 安装依赖//npm npm install -S file-saver xlsxnpm install -D script-loader或者//yarnyarn add file-saveryarn add xlsxyarn add script-lo...转载 2019-05-14 15:39:20 · 164 阅读 · 0 评论 -
解决Vue在setTimeout内修改this失效的问题
在项目中会遇到 定时方面的需求。我们来用setTimeout来处理。1.简单业务需求 var itime = setInterval(function() { if(_this.step0_payMaxTime > 0) { _th...转载 2019-05-14 10:40:49 · 642 阅读 · 0 评论 -
在vue中使用sass的配置的方法
1、创建一个基于 webpack 模板的新项目$ vue init webpack myvue2、在当前目录下,安装依赖$ cd myvue$ npm install3、安装sass的依赖包npm install --save-dev sass-loader//sass-loader依赖于node-sassnpm install --save-dev node-sa...转载 2019-04-16 10:58:38 · 159 阅读 · 0 评论