![](https://img-blog.csdnimg.cn/20190918140012416.png?x-oss-process=image/resize,m_fixed,h_224,w_224)
vue项目
涉及ivew、vue项目中的问题
二进制女猿
二进制的女猿
展开
-
前端好文整理
转自:https://segmentfault.com/a/1190000017577802转载 2019-01-18 17:51:24 · 156 阅读 · 0 评论 -
解决transition第一次不生效问题
问题:transition第一次不生效,是因为需要设置left值,而自己设置的是right值原创 2020-01-07 14:40:23 · 2421 阅读 · 0 评论 -
webpack 知识
1、加载非js类型的文件webpack默认只能打包js类型的文件,无法打包非js类型的文件。如果要打包非js类型的文件,需要手动安装第三方loader加载器.(1)打包css: npm install style-loader css-loader(2)打包less: npm install less-loader npm inst...原创 2019-07-11 10:44:19 · 134 阅读 · 0 评论 -
vue实现table拖拽到tree生成数据,树增删编辑数据
参考:https://blog.csdn.net/If_CannewBoyFriend/article/details/108072059拖拽树主要是绑定 mousedown mouseup 事件 主要参考ztree官网 http://www.treejs.cn/v3/main.php#_zTreeInfo树结构样式参考 https://github.com/tower1229/Vue-Giant-Tree下载地址 https://download.csdn.net/download/If_Canne转载 2021-12-01 10:37:09 · 895 阅读 · 0 评论 -
关于IE下get方法url中中文乱码的问题解决
最近测试提出,网站在ie浏览器下,条件查询失效,bug排查后才发现:原来是url条件查询带有中文导致乱码问题。解决方法如下:转自:https://www.cnblogs.com/githubzy/p/5752976.html最近在做项目的时候遇到了一个问题,在Chrome下,使用ajax的get方法请求数据时,url中带中文是没有问题的,但是在IE下,中文会被变成乱码发送过去,以至于无法获...转载 2019-01-18 13:52:02 · 1082 阅读 · 0 评论 -
cesium常见问题
cesium 常见问题原创 2022-09-07 09:08:39 · 580 阅读 · 1 评论 -
vue-simple-uploader 上传文件并预览
vue-simple-uploader图片上传并预览原创 2022-08-15 15:08:38 · 938 阅读 · 0 评论 -
chunk-vendors.js:1报错 Uncaught SyntaxError: Unexpected token
解决方案:vue.config.js中 改成publicPath: ‘/’,之前是“./”原创 2021-12-25 15:50:59 · 5193 阅读 · 5 评论 -
electron+vue实现桌面应用
electron+vue实现桌面应用1、安装vue-cli,先实现一个项目//1、安装vue脚手架npm install -g @vue/cli//2、创建项目vue create 项目名注意:自定义配置的时候,没有安装vue-router,单独安装 vue-router (npm install vue-router --save)时候vue-router报错:"export ‘createWebHistory’ was not found in ‘vue-router’解决方案安装最新版原创 2021-10-09 17:21:58 · 658 阅读 · 0 评论 -
css hover改变svg颜色
转自https://blog.csdn.net/qq_39785489/article/details/107781746想要实现菜单前的icon(svg格式),根据hover改变svg颜色,并且默认选中项也是高亮。最终实现思路,参考如上连接的方法。<div class="of-h cursor-pointer"> <div class="btn step-init-position"></div> </div>cs原创 2021-08-26 14:50:43 · 2539 阅读 · 0 评论 -
# Vue3里引入three.js报错
vue3引入three报错:property 'modelViewMatrix' is a read-only and non-configurable data property on the proxy target but the proxy did not return its actual value原因:`在这里插入代码片在vue.config.js 引入three,配置第三方插件 const ThreeExamples = require('three') // 第三方插件配置原创 2021-05-17 17:03:27 · 1667 阅读 · 6 评论 -
codemirror格式化json数据格式
codemirror绑定json格式变成一行,需要格式化json解决方案如下 this.jobJson = JSON.stringify(JSON.parse(res.data),null,'\t');//格式化后的json字符串形式原创 2021-03-02 10:00:14 · 2650 阅读 · 1 评论 -
vue+ts使用总结
插件:vue-class-component,作用是用类的方式编写组件。vue-property-decorator深度依赖了vue-class-component,拓展出了更多操作符:@Prop、@Emit、@Inject、@Model、@Provide、@Watch;1、安装:npm install --save vue-property-decorator, npm install --save vue-class-component2、 用法:<script lang="ts">原创 2021-02-28 16:49:01 · 509 阅读 · 0 评论 -
ivew menu 动态的,强制更新menu数据updateOpened
前提:模拟异步加载(实际上数据一次性获取到了),点击功能类加载子菜单问题:menu是根据下拉框的变化而变化,当下拉框变化了,menu父菜单一直展开,子菜单数据不更新(子菜单不更新)业务域下还是上个菜单的数据,点击才会更新数据解决方案:手动更新展开的子目录,修改下拉框时候更新数据 this.openNames = []; this.$nextTick(()=>{ this.$refs.menuRef.updateOpened(); })...原创 2021-01-05 10:10:25 · 441 阅读 · 0 评论 -
vue cli2 打包图片地址不对
问题前提:router配置了baseUrl,base: baseUrlexport default new Router({ base: “/test/”, routes: [], })1、问题描述:打完包服务器上有些图片路径(都是相对路径)不正确,一部分路径正确。正常渲染的图片会被渲染成base64,不正常渲染的路径会自动带着baseUrl,导致图片路径错误无法渲染。//data中加载的是assets目录下的图片img: require("../../assets/1.png")//打包原创 2020-12-23 09:54:23 · 524 阅读 · 0 评论 -
VUE中assets与static的区别
转自:https://www.jianshu.com/p/8341edbc74361、相同点: 文件夹中的资源在html中使用都是可以的。2、不同点:使用assets下面的资源,在js中使用的话,路径要经过webpack中的file-loader编译,路径不能直接写2.1 static :该目录下的文件是不会被wabpack处理的,它们会被直接复制到最终的打包目录下面(默认是 dist/static ),且必须使用绝对路径来引用这些文件。这是通过在 config.js 文件中的 build.a原创 2020-11-05 10:15:17 · 630 阅读 · 0 评论 -
vue 点击菜单报错
转自:https://www.cnblogs.com/webdragon/p/11355080.html点击菜单,控制台报错信息 :vue-router.esm.js?8c4f:1958 Uncaught (in promise) NavigationDuplicated: Avoided redundant naviga解决方案:解决方法一:经过多次尝试发现原因可能是 在重新下载依赖包时,安装的vue-router还是之前出错的那个版本, 解决方法也很简单,在项目目录下运行 npm i vue-r原创 2020-10-29 16:00:03 · 826 阅读 · 0 评论 -
vue 面试题
最近开始学习,准备面试。记录下学习中vue知识点一、MVVM(Model–View–Viewmodel)原理理解1、MVCM:Model,模型层V:view,视图层C:Controller,控制层用户操作页面,请求数据,视图层将指令传送到控制层,控制层完成业务逻辑,通过模型层将数据返回视图层,完成前端页面渲染。三者之间通信是单向的2、MVVMM:Model,模型层V:view,视图层VM:ViewModelViewModel是将Model和View关联起来。MVVM与MVC最大的区原创 2020-08-25 17:19:57 · 161 阅读 · 0 评论 -
vue组建通信的几种方式
一、父组件 ===》 子组件1、props父组件:<HelloWorld msg="Welcome to Your Vue.js App"/>子组件:props:{msg:String}2、refs父组件:<HelloWorld ref="hw"/>调用子元素的方法以及属性this.$refs.hw.xx=xxx3、子元素children父组件:<HelloWorld />调用第一个子元素的方法以及属性this.$children[0原创 2020-07-03 15:30:20 · 384 阅读 · 0 评论 -
简记webpack运行报错 Uncaught TypeError: self.postMessage is not a function
说好2017Fix的还是能重现,可能项目的版本比较旧了,简要记录解决办法1.错误:index.js?bed3:67 Uncaught TypeError: self.postMessage is not a functionat sendMsg (index.js?bed3:67)at Object.invalid (index.js?bed3:83)at SockJS.onmessag...转载 2020-04-14 10:29:21 · 2581 阅读 · 0 评论 -
ivew table的多选框和input 冲突的问题
最近开发遇到了一个ivew table的多选框和input 冲突的问题,目前解决不了,求助!!问题描述:勾选左侧的table行,加入到右侧table中(这个功能已实现),但是别名列是input输入框,问题是input内容修改,导致已勾选的自动取消(如下图所示,包含修改的行以及其他行勾选的都会自动取消勾选)先记录下,目前还没找到解决方案,只能抛弃ivew...原创 2020-03-26 18:54:02 · 394 阅读 · 0 评论 -
vue 项目IE存在的问题
一、IE中promise未定义原因是ie不支持es6语法,需要导入依赖包1、npm install --save-dev babel-polyfill2、在main.js中引入: import “babel-pol二、路由失效,vue-router 在ie内核下页面不跳转参考:https://blog.csdn.net/iorn_mangg/article/details/8785606...原创 2020-02-13 11:33:52 · 433 阅读 · 0 评论 -
ivew 中添加多个echarts组件,实现跑马灯效果,并解决分页切换问题
vue项目需求:实现跑马灯中多个echarts切换的效果。由于项目用的ivew,所以用的Carousel标签,同时需要多个echarts,所以将echarts封装成了组件echarts-line。1、代码如下: <div class="home-right-carousel"> <Carousel loop class="items" v-model="val...原创 2020-02-06 16:13:59 · 1844 阅读 · 1 评论 -
修改ivew默认样式
今天做项目发现修改iview的默认样式不起作用,去掉scoped生效,但是会污染全局样式,采用以下方式1、使用 >>>,不用取消scoped.test >>> header{}2、取消 scoped,添加自己的className,在自己的className下添加样式例如modal遮罩:<Modal class-name="test"&g...原创 2019-08-21 10:57:37 · 936 阅读 · 0 评论 -
vue 打包上架注意事项
1、打包路径不对config下面的index.js文件 build: { // Template for index.html index: path.resolve(__dirname, '../dist/index.html'), // Paths assetsRoot: path.resolve(__dirname...原创 2020-01-03 10:41:54 · 326 阅读 · 0 评论 -
vue 项目ztree 异步加载树
1、在data()添加setting设置setting: { data: { simpleData: { enable: true, idKey: "", pIdKey: "", rootPId: 0 } }, check: { //不显示复选框 enable:...原创 2019-11-11 16:59:20 · 1666 阅读 · 2 评论 -
vue 实现换肤功能
公司项目要实现vue项目换肤功能,要求一套深色,一套浅色,考虑到最节省时间的就是写两套css,一套light.css,一套dark.css,然后切换css一、实现思路:切换选中的皮肤状态(light,或者dark)存储在sessionStorage中,监听sessionStorage数据变化,切换index.html中引入的css文件二、实现过程1、在main.vue添加: <p s...原创 2019-10-31 15:30:41 · 1971 阅读 · 0 评论 -
iview tree层级太多显示内容太长,增加Tooltip文字提示
1、问题描述:在开发的过程中发现使用iview 的树形结构,但是数据太长,需要超长隐藏,显示...,并且鼠标滑过标题显示标题内容。利用render自定义Tooltip,鼠标滑过显示树的内容。<Tree:data="data1":load-data="loadData":render="renderContent"style="margin-left: 16px;"...原创 2019-09-23 14:24:02 · 3225 阅读 · 0 评论 -
vue页面已经跳转,但是watch获取不到$route
1、问题描述: 在开发的时候使用 this.$router.push({path:"/test",query:{name:"test"}}) 进行页面跳转,页面已经跳转至test了,并且路由显示"test?name='test' "(1)watch监听获取$route(to, from) {console.log(this.$route);//打印空对象,获...原创 2019-09-03 09:06:48 · 7062 阅读 · 0 评论 -
多个swiper之间分页相互影响
解决方法:在nextEl和prev中加上父元素,.out_container为父元素的classnavigation: {nextEl: ".out_container .swiper-button-next",prevEl: ".out_container .swiper-button-prev"}原创 2019-09-03 08:41:38 · 1471 阅读 · 0 评论 -
Tree 树形控件 鼠标事件以及button按钮的显示问题
官方文档:https://www.iviewui.com/components/tree针对案例四:1、想要button不显示图标,显示文字h('Button', { props: Object.assign({}, this.buttonProps, { icon: 'ios-add' }),//取消style: { marginRight: '8px' }...原创 2019-08-05 15:14:44 · 1055 阅读 · 0 评论 -
vue好用的插件地址
1、swiper实现页面切换等功能地址:https://www.npmjs.com/package/vue-awesome-swiper2、vue-ztree实现树形结构,地址:https://github.com/lisiyizu/vue-ztree-2.03、better-scroll在vue中使用better-scroll实现移动端滑动效果地址:http:/...原创 2019-07-02 11:32:19 · 393 阅读 · 0 评论 -
使用iview导航栏实现 菜单保留 只更新内容
需要在router中index.js,将跳转的路由配置为children的形式。原创 2019-07-02 09:44:04 · 1833 阅读 · 3 评论 -
vue页面中name的用处
最近利用工作之余学习vue的一些细节,总结下:1、在页面中使用递归时需要使用name2、name为DetailList的页面不使用缓存时:<keep-alive exclude="DetailList"><router-view/></keep-alive>3、使用vue Devtools 查看的组件名称为name的名称...原创 2019-06-27 15:14:18 · 3069 阅读 · 0 评论 -
vue 设置某一页面不缓存的方法
由于添加 <keep-alive>之后,如果页面Detail.vue不需要缓存功能,可使用如下方法:1、mounted不执行,只有activated执行:activated() {this.getFun();}2、App.vue 设置 <keep-alive exclude="Detail">exclude="Detail" ,Detail为该页...原创 2019-06-27 15:07:18 · 3446 阅读 · 1 评论 -
Vue项目使用vue-awesome-swiper轮播插件
地址:https://www.npmjs.com/package/vue-awesome-swiper遇到的坑:1、需要安装 npminstallvue-awesome-swiper@2.6.7 --save 否则:图片轮播有bug2、轮播速度太快,设置deplay不起作用,此时需要设置speed:2000参数...原创 2019-06-17 15:25:35 · 562 阅读 · 0 评论 -
vue.js的devtools安装 调试vue.js应用的浏览器扩展 Chrome插件
转自:https://www.cnblogs.com/lolDragon/p/6268345.html原创 2019-06-13 14:36:08 · 224 阅读 · 0 评论 -
vue环境搭建npm+webpack
1、在安装node地址:https://nodejs.org/en/因为vue的运行依赖于npm,而node内嵌了npm包管理工具,因此使用npm,只需要安装node2、查看node、npm的版本号当查询到版本号时候,即为安装成功备注:完成npm安装后,可选择安装淘宝npm镜像cnpm3、安装全局vue-cli脚手架输入在命令行输入:npm install --gl...原创 2019-06-11 10:16:22 · 354 阅读 · 0 评论 -
vue项目搭建提示“Cannot find module 'webpack'”
查资料发现该链接的回答可用:https://blog.csdn.net/vivian_wang07/article/details/83587560因为在webpack 3中,webpack本身和它的CLI以前都是在同一个包中,但在第4版中,他们已经将两者分开来更好地管理它们。所以用 npm install webpack-cli -g 命令全局安装webpack-cli即可。...转载 2019-06-10 15:09:25 · 2149 阅读 · 0 评论 -
iview下拉框select添加filterable造成的bug
在使用select下拉框的过程中,需要进行查询,因此添加了filterable属性,但是造成bug,导致第二次选择只有上次选中的结果,解决方案如下:1、在Select中添加ref="dataSet"属性。<Select v-model="bindData" class="selectCss" ref="dataSet" filterable> &...原创 2019-03-22 15:32:21 · 3353 阅读 · 0 评论