vue
昵称已存在lxttttt
这个作者很懒,什么都没留下…
展开
-
import { useRouter } from ‘vue-router‘打印useRouter为undefined
useRouter打印为undefined原创 2022-06-17 23:24:56 · 2401 阅读 · 2 评论 -
在vue中使用monaco-editor
1.初始化2.修改属性updateOptions3.语言包的引入4.事件5.插入修改文本6.销毁原创 2022-01-19 17:53:13 · 4348 阅读 · 0 评论 -
element ui使用级联选择器el-cascader封装下拉框
之前项目中使用drownmenu封装下拉框,后面出现了一系列问题,用户体验感很不好。现在重新使用cascader重新封装下拉框组件。原创 2021-12-15 11:11:50 · 2288 阅读 · 0 评论 -
Error in nextTick: “TypeError: Right-hand side of ‘instanceof‘ is not callable“
vue项目中突然报错Error in nextTick: “TypeError: Right-hand side of ‘instanceof’ is not callable”在网上查后发现是因为props定义属性时类型写错了props的type类型需要首字母大写参考链接原创 2021-12-15 10:18:27 · 1260 阅读 · 0 评论 -
vue2与vue3关于数据劫持的一个区别
vue2中采用Object.defineProperty()的形式进行数据劫持,这种方式经常导致数组无法更新值的问题。vue3中采用proxy的形式进行数据劫持,这种数据劫持方式可以劫持所有数据的变化,保证了数据正确更改渲染到页面,但proxy采用ES6语法结构,具有兼容性问题。...原创 2021-12-01 18:07:15 · 267 阅读 · 0 评论 -
element table动态表头数据刷新后表格高度变化,el-table__body-wrapper is-scrolling-left元素高度计算错误
在使用element table时,header数据会根据页面数据发生变化,这个时候会发现刷新数据后页面表格高度发生变化,会短一截。这是element ui框架自身的问题。打开控制台会发现浏览器自动加了一个高度样式,一般来说element style加的样式可以通过给页面样式添加!important进行覆盖,但elementUI中的样式找不到应该修改的地方可以给当前页面的table上添加一个class,通过样式穿透+!important的方式更改高度.el-table__body-wrapper是原创 2021-11-26 14:47:13 · 3101 阅读 · 1 评论 -
element UI对el-dropdown的二次封装(三级下拉框)
<template> <el-dropdown trigger="click" :hide-on-click="true"> <el-button> <svg-icon :icon-class="iconClass" class-name="icon-svg" /> <span>{{ text }}</span> <i class="el-原创 2021-11-09 17:50:32 · 1081 阅读 · 0 评论 -
在render中渲染el-dropdown
模板结构为<el-dropdown> <el-button> <svg-icon icon-class="filter" class-name="icon-svg" /> <span>筛选</span> <i class="el-icon-arrow-down el-icon--right" /> </el-button> <el-dropdown-menu slot="dropdown">原创 2021-11-04 16:21:02 · 955 阅读 · 0 评论 -
解决在vue中使用render渲染element ui无法添加class的问题
需要使用element ui在table中嵌入el-input在使用render对el-input进行渲染后,觉得样式不好看,想要在el-input中添加一个自定义的class直接使用下面这种方式添加class发现无法添加{ prop: 'valueTo', label: '数值(到)', render: (h, params) => { return h('el-input', { attrs: { value: params.row.valueTo }, class: 'input-d原创 2021-10-13 14:35:24 · 2558 阅读 · 0 评论 -
Duplicate keys detected: ‘tab-2‘. This may cause an update error.
出现这种问题是因为v-for中的key值出现了重复,但不要盲目的将key值设置为index,具体情况要具体分析。项目中使用到了element的tab组件,点击tab的关闭按钮删除tab将key设置为index后,删除某一项tab,再添加tab后,添加的tab的key值就会与删除前最后一项的key值相同。如果tab有对应的id值,最好将key设置为id...原创 2021-08-16 11:22:50 · 1570 阅读 · 0 评论 -
vue子组件和父组件之间传值方法
父组件向子组件传值(prop-主要用于传递数据)父组件向子组件传值分为两步:1.父组件动态绑定一个需要传递的值2.子组件在props属性中获取到父组件中传递的值,并使用例子父组件:在父组件中动态绑定fatherMsg,并将msg1的值传递给fatherMsg<template> <!-- 组件之间传值--父组件 --> <div class="father"> <son :fatherMsg="msg1"></son&g原创 2021-08-02 14:47:45 · 406 阅读 · 0 评论 -
elementUI在vue中使用时css样式不生效
根据官方提示先是使用npm i element-ui -S对element-ui进行了安装,并按照官方提示对整个Element进行引入,但在测试element-ui中淡入淡出动画时发现按照官方写法无法出现正确的结果:可以看到,图中的按钮样式不对,而且点击按钮后也没有出现内置过渡动画冲洗阅读文档后发现了这么一段话:这说明在我使用npm i element-ui -S时只是引入了js文件,而css文件需要单独引入解决办法:找到项目的index.html文件,通过CDN的方式引入css文件引入后实原创 2021-07-30 10:57:12 · 1360 阅读 · 2 评论 -
vue生命周期
vue的生命周期分为以下几个部分beforeCreate ->初始化事件和生命周期created ->初始化data和methodsbefroeMount ->完成模板实例化mounted ->渲染数据到页面上beforeUpdate ->更新Model层的dataupdate ->更新View层的databeforeDestroy ->进入销毁状态destroyed ->销毁掉组件中的数据、过滤器、函数、指令等图示如下:原创 2021-04-23 23:02:38 · 114 阅读 · 0 评论