vue
星星之火M
越努力越幸运越优秀
展开
-
Vue -- 后台返回的excel文件流,前端显示在页面上
1.npm下载并引入://安装npm install --save xlsx file-saver//需要的页面引入importXLSXfrom'xlsx'2.data里定义一个参数tableHtml3.处理方法methods:{ dealt: function(url) { let that = this; var xhr = new XMLHttpRequest() xhr.open('get', url, tru...原创 2020-10-19 18:03:40 · 4421 阅读 · 1 评论 -
Vue -- element UI 开发问题记录
1.原创 2020-04-16 16:10:03 · 1053 阅读 · 0 评论 -
Vue -- 报错:Duplicate keys detected: '892834eb-a50c-488c-83ea-cc23f05e2875'. This may cause an update
今天启动项目,测试时,发现一个报错:Duplicate keys detected: '892834eb-a50c-488c-83ea-cc23f05e2875'. This may cause an update。具体如下:问题:使用Element UI的Tree 树形控件出现问题。上网查了一下,问题定位在该控件的node-key属性值重复了。该值对应的是id,id值一般都是不可重复...原创 2019-12-26 10:09:53 · 345 阅读 · 1 评论 -
Vue -- Element UI的Tree组件中,this.$refs.menuTree.setCurrentKey()设置当前被选中的树节点无效果?$nextTick
在项目中,在数据请求完后,获得allMenuData,然后通过 this.$refs.menuTree.setCurrentKey()设置当前被选中的树节点。但是发现并没有效果。原因:DOM并未渲染完,也就是被选中的树节点还没渲染出来,所以对它操作是无效的。所以需要借助$nextTick,确保DOM已渲染。$nextTick(function(){})//或者$nextT...原创 2019-08-22 10:48:16 · 29127 阅读 · 7 评论 -
Vue -- iview中,DatePicker日期控件类型type="datetimerange" ,表单验证validate不通过问题。
解决如下:适合所有类型的验证:daterange、datetimerange、date、datetime、year、month。<FormItem label="任务时间:" prop="taskTime"> <DatePicker type="daterange" placeholder="开始时间-结束时间" v-model="formItem.taskTi...原创 2019-08-16 17:22:18 · 8999 阅读 · 5 评论 -
Vue -- iview 中,给DatePicker赋初始值时报错: Invalid prop: type check failed for prop "value". Expected Date..
在项目中,给 DatePicker 日期选择器赋初始值时,报了错:type check failed for prop "value". Expected Date, String, Array, got Number with value 2019。 具体如下:原因:给DatePicker 赋的值必须是date类型,如果是字符串类型的,则需要使用new Date(value)将值转为...原创 2019-08-16 09:19:48 · 3162 阅读 · 0 评论 -
Vue -- 使用element ui中的el-button、iview中的Input组件添加@click、@keyup.enter等事件,无效?
做vue项目中,我们会选择各种ui组件去搭建页面,如element ui 、iview等等。在使用它们的组件(如element ui中的<el-button>和iview中的<Input>)绑定事件如@click时,发现并没有效果?在页面上,使用element ui中的<el-button>、iview中的<Input>或者自己定义的组件,我们习...原创 2019-08-20 10:13:37 · 8905 阅读 · 4 评论 -
Vue -- 引入jQuery或者引入element ui
一. jQuery引入1. 安装 npm install jquery --save2. 引入21. 局部引入,在需要使用的页面进行引入import $ from 'jquery'22. 全局引入在项目目录下build下的webpack.base.conf.js文件头部加入var webpack = require('webpack')并在module...原创 2019-08-09 17:43:35 · 1694 阅读 · 0 评论 -
Vue -- vue问题记录
1.路径:config/index.js,proxyTable里的参数"changeOrigin"在proxyTable中有个参数是changeOrigin,如果设置为true,那么本地会虚拟一个服务端接收你的请求并代你发送该请求,这样就不会有跨域问题了,当然这只适用于开发环境。2.Vue.config.productionTip = false开发环境下,Vue 会提供很多警告来帮你...原创 2019-12-24 15:27:12 · 214 阅读 · 0 评论 -
Vue -- 全局过滤器filter和全局公共方法(单独写在一个js文件,在main.js引入并注册),并在过滤器方法中使用公共方法。
1. 全局过滤器filter创建一个filters.js文件,内容如下://清空前后空格exports.trim = function (val) { return val.replace(/(^\s*)|(\s*$)/g, "")}在main.js中引入,如下://注册filterimport filters from '../../assets/js/filter...原创 2019-08-08 10:48:16 · 5273 阅读 · 0 评论 -
Vue -- sass实时编译成css
1. 全局安装sassnpm install node-sass -g2. 在src > assets下创建css文件夹。21. 在css目录下,创建一个文件 _t.scss内容如下:注意:这里每个scss文件命名要以"_"下划线开始。.wrap{ color:#fff; div{ font-size:20px; }}22.在cs...原创 2019-08-05 10:46:16 · 3436 阅读 · 6 评论 -
Vue -- webpack打包vue项目,发现“多行超出显示省略号”失效。-webkit-box-orient:vertical;样式被移除?
今天对vue项目进行打包,并在腾讯云上部署后,发现“多行超出显示省略号”无效,查看样式时发现-webkit-box-orient:vertical;被移除了?然后在上网找到了原因和相应解决方案。原因:autoprefixer会自动移除老式过时的代码相应解决方案:如下,添加注释关闭autoprefixer,重点是那两行注释,不可去掉。div{ overflow:hidd...原创 2019-06-21 14:51:32 · 799 阅读 · 0 评论 -
Vue -- vue项目,执行npm install,出现错误:Can't find Python executable "python", you can set the PYTHON env...
从github中,下载vue项目时,运行npm install ,会出现一下问题:Can't find Python executable "python", you can set the PYTHON env variable.错误原因:Node.js 在安装模块的时候报错,缺少python环境,因此需要安装python执行如下命令:npm install --py...原创 2019-06-20 17:45:07 · 21979 阅读 · 4 评论 -
Vue -- vue项目从创建到打包(以及打包后会出现的问题)
确保npm已安装一. 项目创建1. vue-cli:vue脚手架,提供好基本项目结构npm install vue-cli -g //安装vue命令环境验证是否安装成功,可执行命令:vue –version2.生成项目模板vue init <模板名> 本地文件夹名称本身集成很多项目模板: simple ...原创 2019-06-19 17:58:30 · 4902 阅读 · 0 评论