![](https://img-blog.csdnimg.cn/20201014180756925.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
Vue
Michealkz
这个作者很懒,什么都没留下…
展开
-
vue element ui 时间选择器设置
需求:设置时间选择器,只能选择2018-01-01之后切小于当前时间的数据<el-date-pickerv-model="rqq"type="date"placeholder="选择开始日期"value-format="yyyy-MM-dd"style="width:160px;font-size:16px":picker-options="pickerOptions0">...原创 2020-02-14 14:39:16 · 878 阅读 · 0 评论 -
Vue Element Admin 使用mock模块模拟数据
Mock 数据是前端开发过程中必不可少的一环,是分离前后端开发的关键链路。通过预先跟服务器端约定好的接口,模拟请求数据甚至逻辑,能够让前端开发更加独立自主,不会被服务端的开发所阻塞。vue-element-admin项目的所有请求都是通过封装的request.js进行发送的,所有的请求都设置了一个baseURL,而这个baseURL又是通过读取process.env.VUE_APP_BASE_A...原创 2019-08-30 09:10:02 · 12503 阅读 · 11 评论 -
vue-cli3 关闭eslint
找到.eslintrc.jsmodule.exports = { root: true, env: { node: true }, 'extends': [ 'plugin:vue/essential', '@vue/standard' ], rules: { // 'no-console': process.env.NODE_ENV ==...原创 2019-08-23 14:11:24 · 4192 阅读 · 3 评论 -
Vue中的render函数
render函数render:function(createElement){return createElement(APP)}其中的形参是一个方法,作用是根据给定的组件渲染,把给定的组件渲染到el区域中路由:hash到组件的对应关系,目的是实现单页面应用开发使用vue-router实现组件的切换,vue-router内部帮我们实现了OnHashChange()路由的使用:1.npm...原创 2019-08-05 10:33:28 · 611 阅读 · 0 评论 -
es6箭头函数用法
箭头函数是es6的一种函数的简写方法。var f = v = > v;//等同于var f = function(v){ return v;}var sum = (num1,num2) => num1+num2 ;//等同于var sum = function(num1,num2){ return num1+num2}[1,2,3].map(f...转载 2019-07-31 16:39:04 · 187 阅读 · 0 评论 -
背景图片居中全屏自适应显示
.backg{background-size: cover;background-image:url(../assets/images/111.png);background-repeat:no-repeat;background-position:center;background-attachment:fixed;}转载 2019-07-31 16:36:16 · 531 阅读 · 0 评论 -
es6函数的rest参数和拓展运算符(...)的解析
es6的新特性对函数的功能新增加了rest参数和…的拓展运算符。这是两个什么东西呢?先来看一个问题:如何获取一个函数除了定义的参数之外的其他参数?传统的做法是借助函数的arguments关键字来获取的。方法如下:function add(a,b){ var i=2,rest=[]; if(arguments.length>2){ ...转载 2019-07-31 16:29:28 · 473 阅读 · 0 评论 -
vue element 表格增加删除修改数据
这里用到是设置一个弹出框来实现此功能,还有一种方法是直接在原来的基础上面进行修改效果如下:表格的table:<el-table :data="tableData" style="width: 100%"> <el-table-column prop="date" label="日期" width="180"></el-table-column> ...原创 2019-07-31 13:50:45 · 13941 阅读 · 6 评论 -
vue element admin 关闭eslint校验
我们在使用vue-element-admin的时候会出现很多的warning,这是由于开启了eslint校验关闭eslint校验的方法如下:1.在vue.config.js里面进行设置 // lintOnSave: process.env.NODE_ENV === 'development', lintOnSave: false,2.在package.json里面移除下面的代码...原创 2019-07-26 08:30:59 · 4609 阅读 · 0 评论 -
vue 进入和退出全屏方法
1.在template中进行设置我们要触发的方法<div class="fullscreen-button" @click="toggleFullscreen">toggle fullscreen</div>2.在data中进行设置进行判断的标识 data() { return { // 设置flag用于判断是否进入全屏 flag:...原创 2019-07-25 10:56:10 · 2659 阅读 · 0 评论 -
vue element 表格合并行并且实现分页效果
小编在开发的过程中遇到一个问题:表格需要进行合并相关的行,但是用方法来控制的时候,第二页和第一页的效果是一样的,并没有根据数据的具体格式来合并相关的行数据,经过一番的研究,终于实现了合并相关行并且进行分页的功能,效果如下所示:这里的解决方法是:我们可以改变后台的数据格式,配合前台的solt-scope进行设置分页时候的表格合并此时选择的分页的条数就是我们的最外层的数据的条数数据的格式如下所...原创 2019-07-20 10:33:17 · 3281 阅读 · 5 评论 -
echarts图表刷新:vue中传递数据给子组件,并且监听子组件中数据的变化,实现刷新echarts图表的功能
首先是在父组件中传递数据给子组件,我们可以使用v-bind来实现<line-chart :chart-data="lineChartData" v-bind:swss="swss"/>在组件当中使用prop属性来接受父组件传递过来的值 props: { swss: { type: String, required: true }...原创 2019-06-27 19:41:22 · 4805 阅读 · 3 评论 -
vue中报错 Duplicate keys detected: 'xxx'. This may cause an update error.
小编在使用vue-element-admin的时候出现报错的情况, Duplicate keys detected: ‘xxx’. This may cause an update error.,这是我在使用element 表格功能的时候,可知其信息是key重复了,这可能会导致一些更新上的错误。果不其然,我在父子组件传值的时候,出现了问题,修复这个bug就好了。<el-option v-...原创 2019-06-27 19:23:33 · 10228 阅读 · 0 评论 -
Vue的生命周期
接下来小编给大家介绍一下vue的生命周期以及每个生命周期当中我们适合做什么实例的初始化阶段1.beforeCreated:当执行到这个函数的时候,当前的实例上只是初始化了主要的生命周期函数而已,但是实例的data和method尚未初始化2.Created:当执行到这个函数的时候,表示当前实例的data和method已经初始化好了,如果想要获取自己的首屏数据,最好在created里面进行调用...原创 2019-06-25 21:52:01 · 129 阅读 · 0 评论 -
vue中使用echart绑定点击事件进行路由切换
小编在使用VUE的时候遇到了一个问题TypeError: Cannot read property 'push' of undefined首先说明一下需求:小编想做的是在vue中使用echarts,然后点击echars图表进行切换路由,在切换路由的时候就报了一个这样的错误。错误的写法是: // 设置表格的点击事件进行路由的切换 this.chart.on( ...原创 2019-06-19 17:39:13 · 5857 阅读 · 10 评论 -
vue element admin中发送请求和设置loading效果
需求:在表格数据加载完成前进入loading显示数据正在加载,数据加载完成后取消loading效果,axios的超时处理和异常的处理之后进行取消loading效果。小编接下来就根据这个这个需求进行分析:1)首先是配置axios,在main.js当中进行引入axios import axios from ‘axios’ 这里是手动导入的axios 没有用框架自带的。然后再main.js当中...原创 2019-06-13 21:20:42 · 10929 阅读 · 4 评论