vue
seasideX
哦!
展开
-
element table 自动滚动
首先在<el-table ref="table"></el-table>标签上写ref="table"// 拿到表格挂载后的真实DOMconst table = this.$refs.table// 拿到表格中承载数据的div元素const divData = table.bodyWrapper// 拿到元素后,对元素进行定时增加距离顶部距离,实现滚动效果(此配置为每100毫秒移动1像素)setInterval(() = > { // 元素自增距...转载 2022-01-15 11:16:26 · 602 阅读 · 0 评论 -
vue项目firefox报错SyntaxError: invalid regexp group
项目使用vue2开发,在谷歌浏览器正常在linux中使用火狐报错 SyntaxError: invalid regexp group修改方法:修改前修改后原创 2021-03-26 13:31:20 · 1115 阅读 · 0 评论 -
vue 监听store的值变化并重置界面大小
监听store中的数值变化,需要用到计算属性,然后watch调用resize方法 computed: { data() { //左侧菜单状态发生变化 return this.$store.state.app.sidebar.opened } }, watch: { data(n, m) { //重置宽高 this.resizeFun() } }, mounted() { //屏幕大小发生变化原创 2021-01-18 14:12:33 · 1760 阅读 · 0 评论 -
vue项目中使用iframe标签引入外部html,并进行数据交互(转)
首先是vue中引入iframe的src怎么引用路径的坑!首先我们需要把静态的html文件和css,js文件放在public目录下.在iframe标签中引用的时候不要使用public/下的什么,这是不对的.去掉public,直接引用即可.(还是打包后发现放在public文件下的文件都会放在根目录,并没有public这个目录)下面就介绍一下怎么交互的问题.vue文件里的写法:iframe文件里的js的写法:...转载 2021-01-13 15:51:00 · 2079 阅读 · 1 评论 -
vue json可视化编辑器 vue-json-editor
安装插件npm install vue-json-editor --save或者 yarn add vue-json-editor使用方法<template> <vue-json-editor v-model="resultInfo" :showBtns="false" //是否展示保存按钮 :mode="'code'" //默认模式 lang="zh" //中文...原创 2020-11-23 18:23:28 · 3093 阅读 · 6 评论 -
基于Vue和Element做Yaml文件的导入导出
其实主要是用到了两个库,实现了json和yaml字符串的互相转换var YAML = require('js-yaml')var json2yaml = require('json2yaml')整个demo代码如下:<template> <div class="app-container"> <el-row> <el-col :span="22"> <el-upload ..原创 2020-10-15 17:12:24 · 3008 阅读 · 2 评论 -
10个简单的技巧让你的 vue.js 代码更优雅(转)
10个简单的技巧让你的 vue.js 代码更优雅????前言????作为深度代码洁癖,我们都希望能写出简单高效的代码,让我们的代码看起来更加优雅,让我们抛弃繁杂的代码,一起开启简单的旅程~~slots 新语法向 3.0 看齐❝使用带有“#”的新命名插槽缩写语法,在Vue 2.6.0+中可用????❞举个例子:构建插槽时,最好规划一下布局。这就是我的文章布局。构建插槽与构建组件没有什么不同。本质上,插槽是具有超强功能的组件,让我们细分一下上面的布局,组件的外观如下:&转载 2020-10-07 13:59:44 · 288 阅读 · 0 评论 -
Vue更新数据但是界面不刷新
Vue更新数据不刷新?直接改data有时候是不行的,比如data[0].name='AAA',数据不是props对象格式------------------------------------------------------------------------------------------------------------试试下面这种方式,亲测可用,$set方式才会被监听this.$set(this.list[num], 'delflag', true)---.原创 2020-07-24 14:07:29 · 802 阅读 · 0 评论 -
解决element 弹出多个message消息提示问题(转)
在新版本的element中,官方对message消息提示做了修改,修改成一个请求对应一个提示语,这就会导致多条消息提示共存的一个问题,而很多情况下,这多条消息提示的内容是一样的,从用户的体验来说,并不友好第一步. 先写一个resetMessage.js import { Message} from 'element-ui';let messageInstance = null;const resetMessage = (options) => { ...转载 2020-07-11 15:55:47 · 2178 阅读 · 0 评论 -
Vue 开发必须知道的 36 个技巧
Vue 开发必须知道的 36 个技巧前言Vue基本用法很容易上手,但是有很多优化的写法你就不一定知道了,本文从列举了 36 个 vue 开发技巧;后续 Vue 3.x 出来后持续更新.1.require.context()1.场景:如页面需要导入多个组件,原始写法:importtitleComfrom'@/components/home/titleCom'importbannerComfrom'@/components/home/bannerCom'imp...转载 2020-07-07 14:03:23 · 139 阅读 · 0 评论 -
前端常用60余种工具方法(转)
1.邮箱export const isEmail = (s) => { return /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+((.[a-zA-Z0-9_-]{2,3}){1,2})$/.test(s)}2.手机号码export const isMobile = (s) => { return /^1[0-9]{10}$/.test(s)}3.电话号码export const isPhone = (s) => ...转载 2020-07-04 14:14:39 · 227 阅读 · 0 评论 -
Vue子组件调用父组件的三种方法(转)
Vue中子组件调用父组件的方法,这里有三种方法提供参考第一种方法是直接在子组件中通过this.$parent.event来调用父组件的方法父组件<template> <div> <child></child> </div></template><script> import child from '~/components/dam/child'; export default {转载 2020-07-04 10:01:47 · 344 阅读 · 0 评论 -
Vue.js 删除data数据
1.从当前列表中删除//从当前列表中删除this.namelist.splice(scope.index, 1)2.删除对象中的某个属性//删除对象中的某个属性//Vue.delete(this.namelist, 'name')this.$delete(this.form,'members1')this.$delete(this.form,'leader1')...原创 2020-07-02 09:52:39 · 3986 阅读 · 0 评论 -
Vue中如何使用定时器
Vue中如何使用定时器 created() { // 如果不加 window ,则会使用 vue实例的方法,将无法清除定时器 this.timer = window.setInterval(() => { // 要执行的函数 this.init() }, 5000) }, beforeDestroy() { w...原创 2020-04-28 14:12:52 · 4430 阅读 · 0 评论 -
(转)vue 点击按钮复制指定内容到剪切板,复制变量值到剪切板
1.安装插件npm install --save vue-clipboard2或者cnpm install --save vue-clipboard2或者yarn add vue-clipboard22.main.js引入,或者在使用的组件页面引入,这里在main.js引入import Vue from 'vue' import VueClipboard fr...转载 2020-04-08 16:44:28 · 559 阅读 · 0 评论