roongyan92的博客

打开dialog会把table选中项清除表格部分代码：<el-table ref="multipleTable" :data=" tableList.slice((currentPage - 1) * pageSize, currentPage * pageSize) " tooltip-effect="dark" style="width: 100%" @selection-change="handleSelectionChang

业务后台开发中，比如商品管理模块中，新增商品和商品详情页面的内容基本一致，这种情况下，我们就不需要多写一个页面啦。写一个页面，通过路由来控制显示的内容watch: { //监听商品列表数据 tableList: { handler(a) { this.tableList = a; this.timeStamp = new Date(); console.log("监听监听======", a); },

原文地址：https://blog.youkuaiyun.com/lisongyue123/article/details/104059406方法一：在子组件中加v-if=“dialogCreateVisible”，添加完信息关闭弹出框之后，再次添加信息时弹出框中各组件的内容为空。<el-dialog title="添加员工信息" :visible.sync="dialogCreateVisible"> <Add ref="addInformation" v-if="dialog

通过指定 Table 组件的 row-class-name 属性来为 Table 中的某一行添加 class，表明该行处于某种状态。1.在表格组件上绑定row-class-name属性 <el-table ref="multipleTable" :data="tableList" tooltip-effect="dark" style="width: 100%" @selec

ElementUi rules表单验证可以在pattern中书写正则，并且配合elementUI进行表单验证。 pattern 属性规定用于验证输入字段的模式。模式指的是正则表达式。rules: { name:[{ required: true, message: '请输入用户名', trigger: 'blur' },{ min: 2, max: 5, message: ...

Vue项目中引入three.js下载three.js文件，在文件尾部加上导出THREE，如图文件在src目录下，在需要的组件中引入，如图启动项目报错_utils_three__WEBPACK_IMPORTED_MODULE_0__.default.PerspectiveCamera is not a constructor原因：webpack会编译src目录下的文件，导...

文档中有一个tableRowClassName方法，可以获取到当前行的indextableRowClassName({ row, rowIndex }) { //把每一行的索引放进row row.index = rowIndex; }, onRowClick(row) { //点击行获取索引 this.uploadImage...

首先，来看下效果图（演示一下图片正常加载与加载失败时的效果）在线体验地址：https://hxkj.vip/demo/vueImgOnerror/一、常规方法解决我们都知道，img标签支持onerror事件，在装载文档或图像的过程中如果发生了错误，就会触发onerror事件。可以使用一张提示错误的图片代替显示不了的图片。例如这样使用：<img src="image...

使用require引入本地文件<el-image fit="contain" :src="require('@/assets/imgs/logo.png')"></el-image>

有时候我们的需求和组件提供的不一致，就需要自己封装组件，有的功能实现起来很麻烦，产品要做一个双击图片打开预览的功能，原生js实现有点费劲。我们看一下Image的源码，发现大图预览是一个小组件image-viewer，打开看看它的props，如下props: { urlList: { type: Array, default: () => [] }...

Vue-cli 3.0 构建项目（一）构建初始项目原创凝弧发布于2018-06-30 22:29:42阅读数 6433收藏展开1. 环境配置 2. 初始化项目 默认配置 自定义配置 自定义细节配置 官方文档https://cli.vuejs.org/1. 环境配置安装 Vue-cli3.0脚手架工具 终端输入运行npm insta...

elemet-ui里提供的upload文件上传组件,功能很强大,能满足单独使用的需求,但是有时候会存在多次复用上传组件的需求,如下图的样子,这时候就出现了问题,页面上有多个上传组件时,要怎么操作呢?之前在网上找到了一位大神的方法,修改源码,在回调函数中多加一个参数,但是这种方法在多人开发时不太适用,因为这要求所有人都要修改源码,这里附上大神的方法,大家可以酌情使用首先在你下个包里面找到...

1.下载 nprogress npm install --save nprogress2.main.js引入 nprogressimport App from './App'import VueRouter from 'vue-router'import router from './router' //你的路由文件//引入nprogressimport NProgress...

vue项目中使用vue-echars绘制图表时，需要实时根据窗口大小调整图表的大小，我使用的auto-resize属性，没有作用，没有找出错误在哪里，使用window.onresize事件，必须销毁才不会报错哦，代码如下：<template> <chart ref="chart1" :options="orgOptions"></chart>&l...

vue项目使用echars的两种方法一、直接引入echarts1.使用命令行安装echarsnpminstallecharts--save2.main.js中引入import myCharts from './comm/js/myCharts.js'Vue.use(myCharts)3.Echarts.vue中<template> &l...

vue项目调试一直提示如下错误最后才发现是注册的clik事件并没有全部放在methods中

微信公众号授权登录获取openid时请求成功，返回错误码41008，提示“missing code”；我们在获取openid时需要将微信重定向地址返回的code参数拿到，传给openid请求，vue使用axios请求数据，默认post请求参数是json格式，但后台需要formData格式的，这时候后台拿不到我们的参数，故报‘missing code’。解决方案：1.引用node中的qs...

配置flexible1.在命令行中运行如下命令安装npm install lib-flexible --save-dev2.在main.js中引入lib-flexibleimport"lib-flexible"; //rem适配3.在项目根目录的 index.html 中添加如下 meta添加 meta 标签<metaname="viewport"...

vue.config.js文件中export defaults = {outputDir:'dist', 所有文件打包到dist目录下，包括index.htmlassetsDir:'weixin', //所有静态资源放到指定目录微信下}结果如图：...

组件传值-父传子父结构<template> 父组件 <com-a :message="msg"></com-a></template><script> export default { data () { return { msg...

Vue的原理input和change事件的区别input触发条件：输入框字符发生变化 change触发条件：输入框失去焦点 v-model的原理 本质上是语法糖 属性绑定和事件绑定 默认事件是input 可以使用lazy修饰符转化change事件 <input type="text" v-model='uname'><input typ...