vue
欣琪
这个作者很懒,什么都没留下…
展开
-
vue 项目中如何加HTML页面及如何传值
最近在做一个vue项目,因项目时间紧张,有一个查看报告的页面及功能没有没有用vue重构,而是把另一个HTML的页面拷贝过来直接使用,但就是再使用的过程中遇到了几个问题,现总结一下。1,直接访问html页面是访问不到的,会默认访问public文件夹下的index.html页面。2,好不容易可以访问页面了,又不知道vue怎么像HTML里传值。针对以上两个问题,在网上找到解决办法如下:第一步,先把htmt页面引入并能成功访问办法就是新建一个vue文件,在这个vue文件中使用iframe把这个HT原创 2021-09-30 16:37:03 · 8313 阅读 · 0 评论 -
vue项目后,生成一个可以修改服务器地址的配置文件
刚做了一个vue的项目,在打包部署完成后领导要求能否修改api的地址,而不是前端修改再打包再发布。因为这个项目是卖给客户的,不同的客户服务器地址肯定不一样,因为项目着急测试和上线,就在网上找了一个最简单的方法,很多介绍webpack配置的,自己没研究明白,所以暂时先把这个简单方法总结一下!主要有以下几个步骤:首先在static目录下创建一个config.js文件,因为webpack打包,不会把static文件打包,所以直接写这里了。里面添加服务器ip及端口地址 window.g是一个全局变量2原创 2021-09-29 14:37:22 · 582 阅读 · 0 评论 -
element-UI 左侧菜单栏保持刷新后还是选中状态
刷新保持当前的选中状态代码如下:重点就是把index的值设置为和路由保持一致:default-active="$route.path"<el-menu :default-active="$route.path" class="el-menu-vertical-demo" :collapse="isCollapse" :collapse-transition="false" background-color="#4578FF" text-color="#fff">原创 2021-09-24 16:54:56 · 1364 阅读 · 0 评论 -
vue 结合element 实现时间搜索功能
要实现的效果如下:页面代码如下: <el-select v-model="dateValue" clearable placeholder="全部时间" size="medium" style="margin: 0 30px 20px 0" @change="timeSearch()"> <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"&原创 2021-08-07 10:50:40 · 2038 阅读 · 0 评论 -
关于在vue中使用echarts时碰到的问题: Error Initialize failed invalid dom
一,背景:单独封装了一个JS的echarts方法,组件中调用这个方法后就会报错Error Initialize failed invalid dom。代码及报错如下:vue 组件中使用:这是就会出现报错信息:1 可能会报错:“Error: Initialize failed: invalid dom.”原因是dom还没挂载完成,导致报错,这里有几个处理办法:1.1 这里不要用created(用mounted),created这时候还只是创建了实例,但模板还没挂载完成1.2 用this.$原创 2021-07-31 10:35:08 · 6946 阅读 · 3 评论 -
el-table表格树状图复选框全选问题,勾选全选时,子结构未被勾选
在table里进行绑定ref="districtTable" @select-all="selectAll"在data里进行声明isAllSelect: false //定义是否全选的初始值在方法methods里写// 全选/取消选操作selectAll() { this.isAllSelect = !this.isAllSelect; // isAllSelect data里定义的初始值 this.splite(this.parentsData, this.isAllS原创 2021-07-10 14:45:50 · 1142 阅读 · 1 评论 -
vue 正在加载的使用方法
refresh() { const loading = this.$loading({ lock: true, text: 'Loading', spinner: 'el-icon-loading', background: 'rgba(0, 0, 0, 0.7)' }); setTimeout(() => { loading.close(); }, 500);},原创 2021-07-03 17:24:58 · 509 阅读 · 0 评论 -
重置数据this.$options.data()
很多需求会重置表单,刚开始使用的方法就是一个个进行置空// 新建家长createParents() { this.dialogVisible = true; this.addOrRevise = 1; this.titleName = "新建家长"; this.createParentsInfo = { mobile: "", remark: "", students: [ {原创 2021-06-29 11:26:19 · 207 阅读 · 0 评论 -
vue + element-ui 对复杂对象型数组进行表单验证
1,需要验证的复杂数据对象现在让我们走进这个上述表单的数据的实况,如下所示:createParentsInfo: { mobile: "", remark: "", students: [ { isPrimaryContact: true, relationshipId: "", userId: "", userName: "", studentsList: []原创 2021-06-25 17:41:40 · 1180 阅读 · 0 评论 -
ElementUI Table组件树表结构默认展开一级目录
贴个效果图,理解的更直观一些<!-- 列表区域 --><el-table v-if="refreshTable" :data="parentsData" border style="width: 100%" :row-key="getRowKey" :default-expand-all="isExpandAll" :tree-props="{children: 'parentDetailWithRelationshipVOS', hasChildren: 'hasChildren'原创 2021-06-25 15:17:42 · 2564 阅读 · 2 评论 -
elementUI 树形表格展开折叠default-expand-all动态改变状态无效原因
elementUI 树形表格default-expand-all动态改变状态无效原因在写树形表格的时候我发现没有办法动态展开和收起表格,在动态修改default-expand-all的时候值发生改变了,但是页面并未有任何改变,很是惆怅。把解决的代码放到下面表格部分js部分data(){ refreshTable: true, //重新渲染表格的状态 默认是全部展开},// 全部展开/折叠toggleRowExpansion() { this.refreshTable原创 2021-06-25 11:26:36 · 6502 阅读 · 3 评论