vue
iorn_mangg
这个作者很懒,什么都没留下…
展开
-
多列表选择checkBox实现
效果图:可以用vue-list-checkBox插件https://www.npmjs.com/package/vue-list-checkbox原创 2021-06-22 17:00:34 · 213 阅读 · 0 评论 -
vue 封装组件,发布到npm
vue官网封装的方法,适用于暴露出调用方法从而来调用组件的插件,例如toast弹框,网上有很多例子,例如https://blog.csdn.net/Kiloveyousmile/article/details/79222148转载 2021-06-17 17:18:38 · 186 阅读 · 0 评论 -
vue 预览本地pdf等文件
新窗口预览pdf文件等,直接使用a标签即可(word文档直接下载),项目中遇到的问题是,预览放在项目中的本地pdf,无论如何都显示不出pdf的内容。后来发现,要预览的文件要放在public下,使用绝对路径加载就可以了。...原创 2020-09-01 19:28:01 · 5333 阅读 · 6 评论 -
vue antd sselect datePicker 等弹出面板样式修改不了解决办法
项目中需要把antd的组件样式修改成设计图的样式风格,修改input,table这些样式直接找到对应的class名字就能修改了,但是再修改sselect datePicker这些有弹出面板的时候发现,无论怎样修改都不生效。F12查看元素:发现面板的元素在最外层(红色),蓝色的是正常的页面元素。试着把修改的样式放在app.vue里面,生效了!...原创 2020-07-31 17:30:31 · 1758 阅读 · 1 评论 -
vue computed报错
搬砖中,在computed中修改了data中属性的值报错:Unexpected side effect in "xxx" computed property;查了一下文档:自己理解为computed中不能直接修改data中的属性值,如果要修改就只能在set中修改,或者使用watch监听修改正在上传…重新上传取消...原创 2020-05-19 16:25:10 · 609 阅读 · 0 评论 -
记一个vue中data定义变量的坑
开发项目中无意发现,vue中methods直接写this.a="sss",没有在data中定义会发现vue不会报错,按道理他会报a is not defined,然后实际操作这个变量会发现他没有产生vue的响应,就是我修改了这个值,在视图上是不会改变的。查看文档发现:...原创 2020-05-12 17:07:34 · 5009 阅读 · 0 评论 -
vue项目打包后动态配置样式(切换主题)
有时候项目需要多套主题,根据不同节日来切换不同的节日,网上有很多方法可以实现。这里介绍vue打包后动态配置样式。在https://blog.csdn.net/iorn_mangg/article/details/105967090这个基础上对配置文件进行修改首先现在public中创建一个config.css样式配置文件,然后再index.html引入,内容:/* 标题样式配置 */...原创 2020-05-07 17:00:41 · 1252 阅读 · 0 评论 -
vue2.0+vue-cli3.0+EarthSDK创建项目
EarthSDK官方示例有基于vue创建地球的http://earthsdk.com/v/last/Apps/Examples/?menu=true&url=./startup-createEarthWithVue.html我没有创建成功,可能是我太菜了哈哈哈。一直报XE is undefined查了资料,发现github上有好东西哈哈哈官方的github上提供了vue+Ear...原创 2020-04-26 13:44:57 · 4207 阅读 · 2 评论 -
vue-cli3+cesium npm引入和官网静态引入
首先创建好vue-cli3的项目,这个就不用说了。然后运行npm install --save cesium安装cesium配置vue.config.jsconst CopyWebpackPlugin = require('copy-webpack-plugin')const webpack = require('webpack')const path = require('p...原创 2020-04-17 17:18:14 · 1930 阅读 · 0 评论 -
vue+vue-cli3项目打包上线部署
使用vue-cli3搭建了一个简单的项目框架,准备上线部署,发现部署上去报错了哈哈哈,然后下面是我踩的坑:结果都是导致部署上去页面时空白的:1、发现报了这个错:原因时因为es6的exports default,import和webpack的require,module.exports不能混用,不能存在同一个页面上。解决一:修改混用的地方,统一成一种解决方法二:在中添加so...原创 2019-12-10 16:13:39 · 1579 阅读 · 0 评论 -
vue keepAlive重新调用请求方法
整个项目在App中使用了keepAlive来缓存页面,优化用户体验,但是在某个页面中我需要重新刷新就麻烦了vue可以用inject['reload']来刷新页面,但是当页面在mounted中调用需要获取表格数据的时候,就不能用inject,会导致,该方法会一直调用,因为页面一直在刷新,如下:inject['reload'],methods: {getlist(){axios.the...原创 2019-11-28 15:38:33 · 2163 阅读 · 1 评论 -
iview select autocomplete修改样式
iview select和autocomplete,dropDown都有下拉选择框,这种框是和vue的<div id="app">一个级别的,所以用父元素包裹,然后添加样式无效,我们直接在css根上修改对应class样式就好了,还是需要/deep/。但是注意不能用transer=true....原创 2019-11-25 11:38:05 · 1411 阅读 · 1 评论 -
vue actived生命周期---解决进入页面不会再次调用接口请求
在vue实际项目中,很多时候会在mounted或者created请求数据接口然后渲染到页面上,但是这两个生命周期都是只会在第一次进入页面后执行,再次进入该页面时,由于vue-router的机制,会缓存已经加载过的页面数据这样会大大提高效率,所以我们使用$router.push等跳转操作时会发现已经在其他页面上修改的数据,跳转到这个页面,修改的数据并没有变化。实际例子:a页面展示了一组数据,需要...原创 2019-10-30 14:52:32 · 16953 阅读 · 1 评论 -
iview table使用自定义按钮取消某个选中的单项
实现效果:选中选项后然后弹出选中的选项框,点击删除按钮删除某一个选项,table中的选中状态也随之变化。ivew坑:给data设置_checked其实对table上的checkBox并没有作用,用js给data数据设置该属性并没有作用,具体看这篇博客:https://blog.csdn.net/love_parents/article/details/82219503delete...原创 2019-01-07 14:57:02 · 4784 阅读 · 1 评论 -
vue 中使用jQuery
安装jquery:npm install jquery --savewebpack配置webpack.base.conf.js文件中开头插入 var webpack = require('webpack'),在最后添加(node:{...}后面)plugins: [ new webpack.optimize.CommonsChunkPlugin('common.js'...原创 2019-02-11 10:14:41 · 282 阅读 · 0 评论 -
vue *!!vue-style-loader!css-loader?{"sourceMap":true}!../../../../vue-loader 报错
https://blog.csdn.net/genius_yym/article/details/82222424转载 2019-02-11 10:16:44 · 725 阅读 · 0 评论 -
vue-router 在ie内核下页面不跳转
在360兼容模式下vue-router跳转失效,路由地址变了,但是页面的内容没有改变,但是之前的项目却没有这个问题后面查资料发现原因:因为当url的hash change的时候,浏览器没有做出相应改变,所以需要一个兼容方案:function checkIE(){ return '-ms-scroll-limit' in document.documentElement.styl...原创 2019-02-21 10:28:10 · 1972 阅读 · 1 评论 -
iview打包icon不显示
vue 的build文件下的webpack.prod.conf.js中将extract:true 改为false原创 2019-07-18 11:30:34 · 465 阅读 · 0 评论 -
vue 使用 Echarts 隐藏后显示变得非常小
原因是echarts开始是根据你定义的div大小来加载的,如果div隐藏了就找不到对应的大小,比例会变小我的项目里使用iview的tabs组件切换的,所以可以用tabs的on-click方法判断当前tabPane的name,然后再执行echarts的方法如果没有用框架的话,那么可以给对应的显示的内容加一个标识,判断是否显示,然执行echarts方法,或者直接用js隐藏显示。统一的思路就...原创 2019-02-26 11:39:33 · 5073 阅读 · 1 评论 -
vue详情展示页面代码组件
样式效果:代码:<style lang="less"> .rowContainer { border: 1px solid #E5E5E5; font-size: 14px; .detailColAll{ display: flex; width: 100%; line-height: 40px; bo...原创 2019-06-11 14:01:12 · 6293 阅读 · 0 评论 -
vue打包动态绑定static里的图片不显示
https://blog.csdn.net/csdn_yudong/article/details/84936130转载 2019-06-12 18:11:08 · 2324 阅读 · 0 评论 -
iview datePicker 禁止选择相同日期
禁止用户选择已经选择过的日期iview datePicker有options可以对日期选择条件进行筛选,可以到官方文档里去查看https://www.iviewui.com/components/date-picker,在我自己实际的项目中,需要选择多个日期:每当选择一个日期后,后面的就不能选择选过的日期,查了半天没查到,后面终于写出来了,其实就一行代码搞定了(最后一行代码)。yea...原创 2019-06-18 11:52:21 · 845 阅读 · 0 评论 -
vue router 多参数
{ path: '/deforest/recordShow', name: '', query:{ id:'', recordType:'' }, component: ()=>import('../pages/deforest/record/recordShow.vue'),},配置界面里需要配置query,跳转就需要对query进行设置...原创 2019-06-20 19:33:16 · 322 阅读 · 0 评论 -
iview table中生成多个Input双向绑定数据
//iview table 的columns的部分代码title: '面积(公顷)',key: "protectArea",render: (h, params) => { return h("Input", { props: { type: 'text', value: params.row.protectArea }, o...原创 2019-06-27 18:01:07 · 1659 阅读 · 0 评论 -
vue组件 npm打包上传后图片资源错误
使用npm打包上传后,发现调用的img资源路径不对,无法显示出来。第一种方法可以将图片转化成base64格式或者引用在线资源进行调用第二种是使用url-loader,在webpack.config.js中修改代码: { test: /\.(png|jpg|gif|svg)$/, loader: 'url-loader', options...原创 2019-07-23 14:03:27 · 1226 阅读 · 0 评论 -
vue百度地图只显示某个省或市的地图,其余部分都不显示
通过这个博主的博客https://www.cnblogs.com/zhengxiaoqing/p/5038241.html,了解到怎么实现这个效果。安装好vue-baidu-map后,methods,添加如下方法,并且在mounted中调用该方法baiduMap() { var map = new BMap.Map("xjMap"); var cityName = '阿克陶县';...转载 2019-08-27 11:23:48 · 12135 阅读 · 5 评论 -
vue 音频文件打包后找不到文件
vue html代码<audio id="myaudio" ref="myaudio" src="../assets/icons/1265.mp3" controls="controls" loop="loop" hidden="true"></audio>发现本地放在static可以播放,但是assets里播放不了找不到MP3文件,打包后也找不到MP3文件然后...原创 2019-08-30 11:33:43 · 2474 阅读 · 0 评论 -
vue-router路由模块划分
https://blog.csdn.net/weixin_34393428/article/details/88694109https://juejin.im/post/5c46c5d0f265da614f709b40转载 2019-10-08 11:29:59 · 770 阅读 · 0 评论