- 博客(40)
- 收藏
- 关注
RSS订阅原创 路由报错RangeError: Maximum call stack size exceeded at redirect (vue-router.esm.js?8c4f:1394:1)
[Vue warn]: Error in render: “RangeError: Maximum call stack size exceeded”found in—> at src/layout/components/Sidebar/Link.vue at src/layout/components/Sidebar/SidebarItem.vue at packages/menu/src/menu.vue at src/layout/components/Sidebar/index.
2022-03-07 11:41:11
2355
原创 报错Error: Uncaught (in promise) TypeError: Object(...) is not a function at eval
报错Error: Uncaught (in promise) TypeError: Object(...) is not a function at eval
2022-02-26 14:53:11
3830
原创 解决Bug[Vue warn]Error in mounted hook: “Error: please transfer a valid prop path to form item“
本文主要讲解el-form里嵌套el-table的报错和解决[Vue warn]: Error in mounted hook: "Error: please transfer a valid prop path to form item!"
2022-02-22 15:20:40
7022
2
原创 el-date-picker 限制可选的开始时间和结束时间
el-date-picker限制可选的开始时间和结束时间交互效果 <el-date-picker :picker-options="pickerOptions" v-model="daterange" type="daterange" format="yyyy-MM-dd" value-format="yyyy-MM-dd" range-separator="~" start-placeholder="开始日期"
2022-02-15 16:08:27
4213
原创 element-ui的el-form表单和el-table校验嵌套使用校验el-input和el-select
element-ui的el-form表单和el-table校验嵌套使用校验el-input和el-select
2022-01-26 17:50:47
9340
4
原创 Vue实现动画效果transition（单、多个元素过渡）
Vue实现动画效果：单个元素过渡transition，多个元素过渡transition-group
2022-01-19 18:35:34
7365
1
原创 函数防抖与节流使用lodash
本文主要介绍函数防抖与节流怎么使用lo正常：事件触发非常频繁，而且每一次的触发，回调函数都要去执行（如果时间很短，而回调函数内部有计算，那么很可能出现浏览器卡顿）防抖：前面的所有的触发都被取消，最后一次执行在规定的时间之后才会触发，也就是说如果连续快速的触发,只会执行最后一次节流：在规定的间隔时间范围内不会重复触发回调，只有大于这个时间间隔才会触发回调，把频繁触发变为少量触发
2022-01-18 17:09:04
1866
原创 vue-router路由深入理解（路由跳转和路由传参）
vue-router路由深入理解：这篇文章主要讲路由跳转和路由传参，声明式导航和编程式导航的跳转和传参的区别
2022-01-12 22:45:02
1419
1
原创 vue-cli2脚手架2项目配置说明
vue-cli脚手架初始化项目babel翻译官：比如让ES6语法翻译成ES5语法其他项目配置1.package.json加上–open让项目运行起来的时候，让浏览器自动打开"scripts": { "serve": "vue-cli-service serve --open", "build": "vue-cli-service build", "lint": "vue-cli-service lint" },2.eslint校验功能关闭在根目录下，创建一个vu
2022-01-07 20:58:15
574
原创 Vue自定义指令directives（函数方式，对象方式）
Vue自定义指令directives（函数方式，对象方式）定义局部指令，定义全局指令，指令执行的时机
2022-01-05 21:33:03
5319
原创 el-table树形数据全部展开和收缩（toggleRowExpansion）
根据element-ui文档的toggleRowExpansion实现el-table树形数据全部展开和收缩
2021-12-13 16:32:01
17615
3
原创 vue.runtime.esm.js?2b0e:619 [Vue warn]: Duplicate keys detected: ‘xxx‘. This may cause an update err
vue.runtime.esm.js?2b0e:619 [Vue warn]: Duplicate keys detected: ‘xxx’. This may cause an update error.found in—> at packages/table/src/table.vue发现问题原因是el-table使用树结构row-key使用了重复的key，需要后端返回一个唯一的key比如id，最后解决了正确的数据结构...
2021-12-13 15:16:16
7026
原创 Vue按键修饰符，鼠标按钮修饰符，系统修饰键
在一些搜索框中，我们需要监听键盘的按下(onkeydown)或抬起(onkeyup)事件以进行一些操作。1.Vue中常用的按键别名：回车 => enter删除 => delete (捕获“删除”和“退格”键)退出 => esc空格 => space换行 => tab (特殊，必须配合keydown去使用)上 => up下 => down左 => left右 => right示例准备方法 showInfo(e){ /
2021-11-21 13:03:39
830
原创 Element-ui使用@keyup.enter.native的原因
@keyup.enter加.native有什么作用？使用Element-ui，因为Element-ui是封装组件，这个时候使用按键修饰符需要加上.native覆盖原有封装的keyup事件即可，可以理解为该修饰符的作用就是把一个vue组件转化为一个普通的HTML标签<el-input v-model="account" placeholder="请输入账号" @keyup.enter.native="search()"></el-input>...
2021-11-21 11:42:45
13708
2
原创 Vue事件修饰符的理解
Vue中的事件修饰符：1.prevent：阻止默认事件（常用）；2.stop：阻止事件冒泡（常用）；3.once：事件只触发一次（常用）；4.capture：使用事件的捕获模式；5.self：只有event.target是当前操作的元素时才触发事件；6.passive：事件的默认行为立即执行，无需等待事件回调执行完毕；示例说明1.prevent：阻止默认事件阻止默认事件， 比如a标签阻止跳转，此时执行alert语句后没有跳转<a href="http://www.baidu.c
2021-11-20 21:51:37
5983
原创 Vue事件基本使用——传参和不传参的使用
Vue事件基本使用总结1.使用v-on:xxx 或 @xxx 绑定事件，其中xxx是事件名；2.事件的回调需要配置在methods对象中，最终会在vm上；3.methods中配置的函数，不要用箭头函数！否则this就不是vm了；4.methods中配置的函数，都是被Vue所管理的函数，this的指向是vm 或 组件实例对象；5.@click=“demo” 和 @click=“demo($event)” 效果一致，但后者可以传参；示例<!DOCTYPE html><ht
2021-11-20 14:59:15
2050
原创 Chrome浏览器 F12控制台中文改成英文
当Chrome浏览器 F12控制台是中文，怎么设置成英文？第一步：点击控制台右上角的设置图标第二步：“语言”选项从浏览器界面语言设置成英文第三步：重新加载DevTools，控制台变成英文了
2021-11-20 14:39:52
20196
4
原创 Vue配置el有2种写法
Vue配置el有2种写法写法一、new Vue时候配置el属性 new Vue({ el: '#root', data: { name: 'xiaoxiao' } })先创建Vue实例，随后再通过vm.$mount(’#root’)指定el的值你可以控制台打印vconst v = new Vue({ data: { name: 'xiaoxiao' } }) v.$mount('#root')示例代码<!DOCTYPE
2021-11-16 20:23:19
656
原创 Vue的data的两种写法
data有2种写法，对象式和函数式初学vue可以先用对象式练习，用到组件时，data必须使用函数式，否则会报错。对象式 new Vue({ el: '#demo', data: { name: 'xiaoming', address: '珠海' } })函数式new Vue({ el: '#root', data() { return { name: 'xiaoming' } }})...
2021-11-16 20:10:17
625
原创 Vue.js数据绑定的方法--单向和双向
Vue数据绑定Vue中有2种数据绑定的方式：1.单向绑定(v-bind)：数据只能从data流向页面。2.双向绑定(v-model)：数据不仅能从data流向页面，还可以从页面流向data。注意点：1.双向绑定一般都应用在表单类元素上（如：input、select等）2.v-model:value 可以简写为 v-model，因为v-model默认收集的就是value值。1.单向数据绑定普通写法<input type="text" v-bind:value="name">
2021-11-16 19:59:20
4376
原创 Vue模板语法(插值语法，指令语法)
Vue模板语法有2大类：Vue官网链接1.插值语法：功能：用于解析标签体内容。写法：{{xxx}}，xxx是js表达式，且可以直接读取到data中的所有属性。2.指令语法：功能：用于解析标签（包括：标签属性、标签体内容、绑定事件…）。举例：v-bind:href=“xxx” 或 简写为 :href=“xxx”，xxx同样要写js表达式，且可以直接读取到data中的所有属性。备注：Vue中有很多的指令，且形式都是：v-???，此处我们只是拿v-bind举个例子。代码<!DO
2021-11-14 21:05:03
314
原创 一、Vue初识和简单应用
一、Vue简介1-1.官网英文官网: https://vuejs.org/中文官网: https://cn.vuejs.org/1-2.Vue发展历程1-3. 描述动态构建用户界面的渐进式 JavaScript 框架 ，作者是尤雨溪二、Vue 的特点1. 遵循 MVVM 模式2. 编码简洁, 体积小, 运行效率高, 适合移动/PC 端开发3. 它本身只关注 UI, 也可以引入其它第三方库开发项目4. 采用组件化模式，提高代码复用率、且让代码更好维护5. 声明式编码，让编码人员无
2021-11-14 20:47:30
603
原创 在Vue使用ag-grid-vue表格的分页自定义使用el-element-ui的分页
<template><div> <div> <ag-grid-vue :selectCol="selectCol" rowSelection="multiple" :rowHeight="rowHeight" :headerHeight="headerHeight" :minColWidth="minColWidth" class="ag-theme-balham" .
2021-11-03 20:31:12
3937
原创 el-checkbox的基本使用，避坑指南
el-checkbox的基本使用，避坑指南使用el-checkbox勾选出现的问题：全选不生效，全选后底下的勾选不能回显
2021-11-01 21:58:42
28600
原创 Ag-grid在vue中使用的必要属性
Ag-grid在vue中使用的必要属性文档链接id="myGrid"——唯一标识@gridReady——渲染完成后的事件:defaultColDef——this.defaultColDef = {}默认定义：所有的列都有的属性:context—— this.context = { componentParent: this } 上下文对象:rowData——表格数据:columnDefs——this.columnDefs=[]每列数据:pagination="true" 启动分页 &
2021-10-24 15:21:34
1947
原创 在vue里引入使用Ag-grid表格插件
在vue里引入使用Ag-grid表格插件1.依赖版本package.json "dependencies": { "@ag-grid-community/core": "^25.1.0", "@ag-grid-enterprise/rich-select": "^25.1.0", "ag-charts-community": "^3.1.0", "ag-charts-vue": "^3.1.0", },"devDependencies": { "@
2021-10-23 21:12:47
1936
原创 div垂直居中和水平居中的多种方式
一、水平居中法1：子元素设置margin:0 auto; <div class="parent"> <div class="child"></div> </div>.parent{ border:solid 2px red; width: 200px; height: 200px; } .child{ background: green; width: 50px; height: 50
2021-10-19 21:54:11
1787
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人