qq_41429765的博客

Vue H5使用vant实现文件上传。

Could not find a declaration file for module '../views/About.vue'. 'D:/vuetest2/src/views/About.vue.

Vue的axios全局封装及调用

vue两行代码实现表单重置清空

命令行执行netstat /nao 即可查到指定的端口占用情况，根据最右侧。的PID在任务管理器中根据pid找到指定的任务关闭即可。1.启动某个程序的时候，提示端口8000被占用，

重点在这网上有很多china文件，但都不合适，直接引入即可。

vue实现虚拟长列表滚动。

Vue打包优化(使用vue-cli)

const path=require('path');function resolve(dir) { return path.join(__dirname, dir)}module.exports={ configureWebpack:{ resolve:{ alias:{ // 设置@符号可代替src目录 '@': resolve('src'),

是因为接口请求缓存导致的直接的办法可以在const service = axios.create({ baseURL: process.env.VUE_APP_BASE_API,//请求路径 timeout: 10000 ,// request timeout headers:{ 'Cache-Control': 'no-cache' //重点清除接口的缓存 }})...

<el-upload name="multipartFiles" //设置上传文件的file参数值类似于formData.append("multipartFiles":file) :on-exceed="handleExceed"//拦截触发非法验证提示 class="uploadaDVen" multiple :action="imgUrls" //上传文件的地址 :on-success="handleVideoSuccessInside.

1.在文件接收的时候设置responseType为blob格式export function personalCourseRecordExport(params) { return request({ url: url, method: 'get', responseType: 'blob', params })} 2.调用接口下载文件 async downLoadTap(){ let res=await cou..

document.title='title名称'在vue中可以在前置守卫中修改或vue页created钩子中执行修改title

<picker class="form-item-picker" mode="multiSelector" //设置picker打开展示的内容列 :range="newCategotyDeptList" //控制选择行的下标 :value="multDeptIndex" //设置picker内容展示的是name的值 range-key="name" //监听每列的滚动 @columnchange="pickerC...

创建mixin.js(名称没有限制可任意名称)export default { data(){ return{ tt:1, cc:2 } }, methods:{ jumpClick(){ console.log('触发了跳'); } }}在其他页面中引用mixin.js<template> &lt.

//vue.config.js//判断是否是生产环境,生产环境返回trueconst isProduction =process.env.NODE_ENV==='production';//引入uglifyjs-webpack-plugin是压缩打包的（打包优化）const uglifyJsPlugin=require('uglifyjs-webpack-plugin');module.exports={ devServer:{ //这个是对所有的接口都代理的...

首先定义vue是在Vue的主文件中定义的//main.jslet vue=new Vue({ router, store, render:h=>h(App)}).$mount('#app');//将vue输出可以被其他页面使用export default vue;//test.jsimport vue from './main.js'function test(){ //即可在当前js中使用此vue的this console.

Vue2的Object.defineproperty的数据劫持<input id="username" />显示输入的值：<div id="userNames"></div>//实现数据劫持双向绑定let obj={};let name="": 对象 对象属性Object.defineproperty(obj,'username',{ get:function(){ .

先推荐两个vscode插件Volar首先推荐Volar，使用vscode开发Vue项目的小伙伴肯定都认识Vetur这个神级插件，有了它可以让我们得开发如鱼得水。那么Volar可以理解为Vue3版本的Vetur，代码高亮，语法提示，基本上Vetur有的它都有。特色功能当然作为新的插件出山，肯定有它独有的功能。多个根节点编辑器不会报错Vue3是允许我们有多个根节点的，但是我们如果使用Vetur就会报错，不会影响运行，但是看起来就很烦。所以当我们转向Volar那么就不会出现这个问题了。

10个实用技巧让你的 Vue 代码更优雅johnYu高级前端进阶2020-10-11关注高级前端进阶，回复“加群”加入我们一起学习，天天进步作者：johnYu链接：https://juejin.im/post/6854573215969181703前言????作为深度代码洁癖，我们都希望能写出简单高效的代码，让我们的代码看起来更加优雅，让我们抛弃繁杂的代码，一起开启简单的旅程~~slots 新语法向 3.0 看齐❝使用带有“＃”的新命名插槽缩写语法,在Vue 2.6

是转换出错，也就是说本是 JSON 字符串，但是其实是一个空对象。所以我们只要在使用JSON.parse ()前，判断下是否有值若为非空则执行JSON.parse

是因为并列的key相同修改一下 {{item}} {{item}}将以上其中一个key改为 {{item}}

<el-upload ref="dynamic" :file-list="fileList" :limit="3" class="float-left" :headers="{'Content-Type':'multipart/form-data'}" action="#" :on-change="(res,fileList)=>{changeUpload(item,indexF,res,fileList)}" list-type.

echarts柱状图的使用let myCharts=this.$echarts.init(document.getElementById('ranking')); myCharts.setOption({ //设置鼠标移入显示提示窗 tooltip: { trigger:'axis', **自定义tooltip** formatter(params){ //以

Uncaught TypeError: Cannot read property 'offsetLeft' of undefinedat window.onscroll

<!--html--> <el-table class="margin-medium-top table" :cell-style="{'text-align':'center'}" :data="tableData" border :header-cell-style="headerCellStyle" style="width: 100%" v-l...

<el-form ref="perfectInfo" :model="perfectData" //所有form表单中的值全放到此JSON中 label-width="90px" :rules="rulesPerfectData" //定义校验规则 class="page-form secondForm"> <el-form-item prop="realName" label="真实姓名">.

顶部默认加载，接口查出相关顶部导航左侧根据顶部查出左侧目录内容每次点击顶部指定导航，左侧根据顶部所选目录查出内容点击浏览器的顶部的返回上一级导航或进入下一级导航根据popstate监听，从而之后根据即将跳转到的路由，后端查出左侧目录，// 事件 调用的方法 false为冒泡传递，true为捕获传递适用于点击事件或滚动事件这种触发事件wi...

使用webpack-dev-server(下简称wds)进行开发时，wds启动了一个运行在node上的web服务器，此时开发环境访问对应的端口时(以8080举例)，浏览器返回的vue页面是wds处理后的结果。跨域。简单来说，在使用ajax请求与当前页面不同来源的数据时，浏览器会拦截服务器发回的响应。在开发环境下，“当前来源”就是http://127.0.0.1:8080，向任何其它地址或端口的请求都会被视作跨域，从而被浏览器拦截。3.devServer的proxy是为了简化开发环境下的跨域请求配置。在.

从IE10+浏览器开始，所有浏览器就原生提供了Base64编码、解码方法，不仅可以用于浏览器环境，Service Worker环境也可以使用。window.btoa('china is so nb') // 编码//结果："Y2hpbmEgaXMgc28gbmI="window.atob("Y2hpbmEgaXMgc28gbmI=") // 解码//结果："china is so nb"IE8/IE9的polyfill  当下，仍有不少PC项目还需要兼容IE9，所以，我们可以专门针对这些.

1.当一个数组中的对象发生变化时，则被建立引用关系接收的值也会发生变化 //当一个数组中的对象发生变化时，则被建立引用关系接收的值也会发生变化 handlePClickBefore(valOut){ console.log('传进来的下标'); console.log(valOut.sortId); //获取上一级的下标的内容，preLevel接收此对象的值建立了引.

通过ref来进行操作，根据唯一id给每一个循环的el-popover赋予唯一名称//html<el-popover :ref="'popover-'+item.id " v-for="(item,professionIndex) in scope.row.major_list" :key="professionIndex" placement="top" width="2

在父组件向子组件用props传值，不断更新的时候或进行复杂的处理值时会遇到子组件接收到的所处理的值不更新,这是我所遇到的问题的解释这个时候可以使用this.$setthis.tableData是处理的值代码如下：let zhi =this.tableData;//....进行业务处理zhithis.tableData=zhi;this.$set(this.tableData);官方的说法:什么是$set?向响应式对象中添加一个属性，并确保这个新属性同样是响应...

Module build failed: TypeError: this.getResolve is not a function at Object.loader 安装node-sass运行报错npm install sass-loader@7.3.1 --save-dev下载完再运行报：Node Sass version 5.0.0 is incompatible with ^4.0.0.npm install node-sass@4.14.1 -D如果还是报错重启项目，重启项目即可.

首先分析：Vue中prop的传递是单向下行绑定的，也就是说只能父传给子，不能反过来，用sync,visible就实现了父子同步，父组件初始化visible,子组件调用关闭事件，触发父组件update事件，父组件在update事件中更新visible变量，改变子组件可见的状态，但是如果dialogFormVisible是对象，则无法update也会报错 <el-dialog :title="title" :visible.sync="dialogFormVi.

有两种解决方法：1.npm install --save node-sass --registry=https://registry.npm.taobao.org --disturl=https://npm.taobao.org/dist --sass-binary-site=http://npm.taobao.org/mirrors/node-sass2.改变自己的node的版本

封装此公共组件通过具名插槽的方式来达到自定义table的效果模板的html的写法： <div> <el-table :cell-style="{'text-align':'center'}" :data="tableData" border :header-cell-style="headerCellStyle"

首先需要安装vuedraggable依赖包：yarn addvuedraggable因为拖拽组件依赖sortablejs,如果项目没有安装sortablejs,可能需要安装一下yarn add sortablejshtml代码：<template> <div class="dndList"> <div class="dndList-list"> <h3>常用</h3> <d...

1、MathJax介绍MathJax是一款运行在浏览器中的开源的数学符号渲染引擎，使用MathJax可以方便的在浏览器中显示数学公式，不需要使用图片。2、步骤2.1引入MathJax 我们通过index.html中加入下面的语句即可引入MathJax,该语句导入的是国内的CDN<script type="text/javascript" async src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/MathJ...

Vue配置公共loading加载