欣琪-CSDN博客

最近在做一个vue项目，因项目时间紧张，有一个查看报告的页面及功能没有没有用vue重构，而是把另一个HTML的页面拷贝过来直接使用，但就是再使用的过程中遇到了几个问题，现总结一下。1，直接访问html页面是访问不到的，会默认访问public文件夹下的index.html页面。2，好不容易可以访问页面了，又不知道vue怎么像HTML里传值。针对以上两个问题，在网上找到解决办法如下：第一步，先把htmt页面引入并能成功访问办法就是新建一个vue文件，在这个vue文件中使用iframe把这个HT

2021-09-30 16:37:03 8566

原创 vue项目后，生成一个可以修改服务器地址的配置文件

刚做了一个vue的项目，在打包部署完成后领导要求能否修改api的地址，而不是前端修改再打包再发布。因为这个项目是卖给客户的，不同的客户服务器地址肯定不一样，因为项目着急测试和上线，就在网上找了一个最简单的方法，很多介绍webpack配置的，自己没研究明白，所以暂时先把这个简单方法总结一下！主要有以下几个步骤：首先在static目录下创建一个config.js文件，因为webpack打包，不会把static文件打包，所以直接写这里了。里面添加服务器ip及端口地址 window.g是一个全局变量2

2021-09-29 14:37:22 629

原创 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 1469

原创 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 2151

原创关于在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 7095 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 1247 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 543

原创重置数据this.$options.data()

很多需求会重置表单，刚开始使用的方法就是一个个进行置空// 新建家长createParents() { this.dialogVisible = true; this.addOrRevise = 1; this.titleName = "新建家长"; this.createParentsInfo = { mobile: "", remark: "", students: [ {

2021-06-29 11:26:19 230

原创 vue + element-ui 对复杂对象型数组进行表单验证

1，需要验证的复杂数据对象现在让我们走进这个上述表单的数据的实况，如下所示：createParentsInfo: { mobile: "", remark: "", students: [ { isPrimaryContact: true, relationshipId: "", userId: "", userName: "", studentsList: []

2021-06-25 17:41:40 1234

原创 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 2643 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 6869 3

原创 CSS3中的tansform实现登录的小样式

点击前点击后代码如下：<html> <head> <title></title> <style> h3{ margin:0; text-align:center; } .box{ width:250px;

2020-05-15 10:12:59 258

原创图片全屏效果的2种方法

图片全屏效果的2种方法第一种：通过CSS使DIV实现全屏效果全屏要素代码如下：新的改变功能快捷键合理的创建标题，有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能，丰富你的文章UML 图表FLowchart流程图导出与导入导出导入第一种：通过CSS使DIV实现全屏效果全屏要素全屏的元素及其父元素都要设置height:1

2020-05-12 10:53:54 1793

原创怎么修改单选框默认的样式----纯css美化radio选择框的样式

效果图如下：简洁的HTML： <label> <input type="radio" name="1" id="" class="a-radio"> <span class="b-radio"></span>好 </label> <label> <input type="radio" na...

2020-03-26 15:37:13 1628

原创常见移动web布局适配方法 rem+js控制适配屏幕

常见移动web布局适配方法固定高度，宽度百分比：这种方法只适合简单要求不高的webApp，几乎达不到大型项目的要求，属于过时的方法。Media Query（媒体查询）：现在比较主流的适配方案，比如我们常用的样式框架Bootstrap就是靠这个起家的，它能完成大部分项目需求，但是编写过于复杂。flex布局：主流的布局方式，不仅适用于移动Web，网页上也表现良好，这也是现在工作中用的最多的布局...

2019-07-09 11:12:29 449

原创 jqgrid调整宽度自适应

//当浏览器调整大小时，调整jqGrid的大小$(window).bind('resize', function () { $("#gridList").setGridWidth($('.col-md-12').width());}).trigger('resize'); $gridList.dataGrid({ url: "Handler/AdminHandle...

2019-06-28 16:14:41 5243

原创把从后台接收到的时间进行时间格式化

1，时间格式化的方法Date.prototype.Format = function(fmt) { //author: meizz var o = { "M+": this.getMonth() + 1, //月份 "d+": this.getDate(), //日 "H+": this.getHours(), //小时 ...

2019-04-26 14:39:46 966

原创获取url中的参数方法

1，获取url中的参数方法function getUrlParam(name) { var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); //构造一个含有目标参数的正则表达式? var r = window.location.search.substr(1).match(reg); //匹配目标参...

2019-04-26 14:20:35 404

原创 PC端滚动加载更多的实现方法

//滚动加载更多var pullRefreshss = true;$(window).scroll( function () { /*当前滚动条到顶部的距离*/ var top = $(document).scrollTop(); /*当前浏览器的可是高度*/ var height = document.body.clie...

2019-04-26 14:10:42 5007

原创使用正则表达式验证注册页面（用户名，密码，确认密码，邮箱，手机号）

2019-03-28 14:21:52 6155

原创头部导航navbar点击自动滚动

// 头部导航点击事件 $(".tab-head li").click(function() { var moveX = $(this).position().left + $(this).parent().scrollLeft(); var pageX = document.documentElement.clientWidth; //设备的宽度 ...

2019-03-27 14:53:54 3126

原创 ios系统下video标签全屏的问题解决方案

video标签在ios上播放视频时会默认全屏显示，通过给video标签添加下面属性可以解决。<video id="welcome-video" src="" poster="./images/voice/poster.png" webkit-playsinline="true" playsinline="true"></video> 注意

2018-12-21 10:52:16 3544 1

原创获取前一页面的URL地址的方法，使从哪个页面登录就返回到哪个页面

var prevLink = document.referrer; //获取前一页面的URL地址的方法，使从哪个页面登录就返回到哪个页面。// 登录成功提示并返回登录前页面$.toast("登录成功", function() { if($.trim(prevLink) == ''){ window.location.href = '../index/';...

2018-11-19 09:24:20 1233

原创 JavaScript JQuery监听浏览器返回时刷新上一页面

本章使用JQuery 监听当浏览器返回（后退时）刷新被返回的页面此代码要放在需要返回上一页的页面// 监听浏览器返回时刷新上一页面JavaScript JQuery $(document).ready(function(e) { var counter = 0; if (window.history && window.hist...

2018-11-02 17:22:25 3075 1

原创 js + ajax实现列表页到详情页的跳转

思路是：点击列表页时，把id传给详情页，在详情页接收列表页传递过来的id，并赋到data中。第一步：列表页传参数id：第二步：//获取url中的参数 function getUrlParam(name) { var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); //构造一个含有目标参数...

2018-10-29 15:25:47 9054 2

原创页面返回顶部的方法

window.onload=function() { // 点击返回页面顶部 $(window).scroll(function(){ if($(window).scrollTop()>400){ $('.top').fadeIn(); }else{ $('.top').fadeOut(); ...

2018-10-19 11:56:53 192

qq_41038929的博客

原创时间格式化

原创 vue 项目中如何加HTML页面及如何传值