![](https://img-blog.csdnimg.cn/20201014180756918.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
VUE
杨大大28
Mind and Head!
展开
-
【VUE项目笔记】
1 场景一:更改事件触发顺序如果给父元素和子元素同时绑定了事件,他们的执行顺序是先执行子元素事件,后执行父元素事件也就是有内往外执行;在JS中,绑定的事件默认的执行顺序是冒泡执行;(1) 如果想更改顺序,则可以开启捕捉模式;下面代码,如果点击按钮,则先输出"divClick",后输出"linkClick";因为默认是冒泡的顺序<div @click= "divClick"> <a href="javascript:void" @click="linkClic.原创 2022-03-15 00:07:01 · 796 阅读 · 0 评论 -
【vue源码工程阅读1:下载源码】认识工程并打包
平时读过源码,但是没有系统总结过,所以趁此机会再整理一下;不光是源码技术细节;从下载代码到运行启动源码过程中每一步都会有我们未涉及或者不熟悉的知识点和技术,所以尽可能触类旁通,都了解一下;这样便于我们逐渐形成一个自己的技术体系。 源码下载首先去github官网下载vue源码;GitHub - vuejs/vue: 🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI o...原创 2022-03-03 00:20:47 · 1449 阅读 · 0 评论 -
vue-cli 3+ 脚手架创建项目
1 全局安装脚手架npm install -g @vue/cli查看版本$ vue --version@vue/cli 4.5.152 创建项目官方地址:创建一个项目 | Vue CLI选择默认的Vue2方式;回车后,稍等片刻,安装完成完成之后的目录结构如下:运行 npm run serve启动项目;默认在8080端口启动3 vue.config.js配置新建的项目没有该文件,需要我们自己创建;详细配置见配置参考 | Vue CLI...原创 2022-01-19 19:20:43 · 563 阅读 · 0 评论 -
vue 方形小图标组件,直接引入使用即可;
1SquareIcon.vue<template> <div :style='outerStyle'> <div :style="innerStyle"> </div> </div></template><script>export default { name: 'App', props:{ options:Object },...原创 2022-01-08 11:58:11 · 691 阅读 · 0 评论 -
笔记:Vue报错Unnecessary use of boolean literals in conditional expression
翻译一下:在条件表达式中不必要的boolean文字使用;直白点没必要把true或者false这两个单词写出来嘛;如下三元运算符在vue中就会报错,不过确实没必要用三元运算符写出来let result=value>10?true:false正确方式:let result=value>10所以在工作中尽量注意即可,即便不是vue工程,亦可养成较好编码习惯...原创 2021-11-15 09:46:54 · 1733 阅读 · 0 评论 -
vue使用threejs加载模型问题整理
1 如果出现错误 "THREE.WebGLRenderer: Error creating WebGL context.需要开启浏览器的gpu加速(GPU-acceleration);地址栏输入:chrome://flags/#ignore-gpu-blacklist,将GPU-acceleration设置可用2 出现错误:Uncaught Error: THREE.OBJLoader: Unexpected line: "<!DOCTYPE html>"...原创 2021-09-29 20:08:52 · 6127 阅读 · 6 评论 -
el-tree 异步树局部刷新(新增,删除,编辑,上下移动)
目录树数据绑定有两种方式,同步和异步。同步:一次性返回所有组织树数据,一次绑定;异步:点击节点,只返回该节点的第一级子节点数据进行绑定,其他节点数据需要点击对应的父节点获取;同步树和异步树进行更新的方式自然也不同;比如实现如下增删改查上下移动操作如果是同步树:对目录树进行增删改查操作后,要实现及时刷新效果,需要重新请求一次接口,然后通过设置展开属性 展开到编辑节点即可;如果是异步树:目录树实现增删改查操作,要及时刷新效果,只能通过触发点击父节点load函数实现;怎么实现及时刷新效果呢;原创 2021-09-07 20:13:44 · 3138 阅读 · 4 评论 -
后端传文件流,前端下载excel方式
1 后端如果传乱码文件流,前端需要通过blob方式下载文件代码如下:需要注意两点:1 ajax请求需要设置返回格式为blob:responseType:‘blob’2 跟后端协调文件格式具体为xls还是其他 axios({ method: "post", url: `localhost://`, data:{}, responseType: "blob", }).then(re原创 2021-08-31 20:33:11 · 859 阅读 · 0 评论 -
vue中怎么实现表格导入导出excel
1 导入excel,即在前端读取到excel数据,通过接口存入数据库即可导入excel用到下面得xlsx库 import XLSX from "xlsx";直接上代码 function readXLSX(file){ let nameSplit = file.name.split("."); let format = nameSplit[nameSplit.length - 1]; if (!["原创 2021-08-31 11:10:12 · 1460 阅读 · 0 评论 -
vue 父组件给子组件传方法,跟传值一样,使用 props属性
1 vue 父组件给子组件传方法,跟传值一样,使用 props属性// 子组件props:{ callback:Function}// 父组件在computed中定义函数,调用异步函数 callback () { return getMonitorPointByName }也可以直接是方法methods:{ callback () { // 函数主体 } callback1 () { // 函数主体原创 2021-07-06 15:06:01 · 296 阅读 · 0 评论 -
笔记:拉取项目node-sass报错
gyp ERR! find Pythongyp ERR! find Python Python is not set from command line or npm configurationgyp ERR! find Python Python is not set from environment variable PYTHONgyp ERR! find Python checking if "python" can be usedgyp ERR! find Python - "python.原创 2021-06-18 14:40:27 · 723 阅读 · 0 评论 -
vue cli3 中禁用 exlint 和pretter 亲测无误
在vue.config.js中加入如下配置即可;lintOnSave:false,devServer:{overlay:{warnings:false,errors:false},原创 2021-03-15 00:56:09 · 165 阅读 · 0 评论 -
Avoid mutating a prop directly since the value will be overwritten whenever the parent component
在vue使用过程中,出现Avoid mutating a prop directly since the value will be overwritten whenever the parent component 问题;意思是通过props 传递给子组件的值,不能再子组件中修改,但其实修改也可以,不影响使用;...原创 2021-02-02 15:06:22 · 385 阅读 · 0 评论 -
vue 脚手架 内部样式打包后,无法编译,导致到不到文件怎么办
1 如果需要再标签内部中使用样式,比如条件判断,按需加载不同图片:style="{'background':'url('@/assets/images/1.png')'}"如果以这种方式是找不到的;所以我们需要用require的方式去引入,这样运行或者打包后可以找到准确路径:style="{'background':'url('+require('@/assets/images/1.png')+')'}"...原创 2021-02-01 15:23:04 · 316 阅读 · 0 评论 -
vue中 根据判断条件添加一个或多个style,及class的写法
style 写法: <i:style="{'color':isBling?'red':'white'}" @click=""></i>class写法 <i :class='[show ?"class1":"class2","iconfont"]' @click="toggleVisual"></i> class1与class2...原创 2020-01-14 09:35:47 · 25073 阅读 · 4 评论 -
vue 样式覆盖问题
记使用过程中 vue的样式覆盖问题1、一般想要覆盖第三方插件样式,可自己定义class,或者直接获取三方类名,添加样式,只需要在后面加 !important属性即可如.test{ font-size:14px !important;}2、vue是以分.vue的模块化开发;规范的.vue包含三部分;可以将样式组件样式写在style标签内<template&g...原创 2020-01-14 09:36:00 · 3864 阅读 · 0 评论 -
v-show、v-if的区别
项目中经常使用v-show 、v-if来控制窗口或者容器的的显示与隐藏,两者效果一样应用的场景:v-show 适合频繁切换显隐的控件;主要不同:v-show 为true,不需要重绘DOM,但是生命周期会完整执行,但不进行任何数据绑定的行为;v-if :为true,重绘DOM;生命周期完整执行;共同点:两者都不能保存状态。...原创 2020-01-14 09:36:04 · 188 阅读 · 0 评论