
Vue
文章平均质量分 55
@小盆友
醒醒,工头喊你搬砖了
展开
-
Lodash 使用及常用方法
Lodash 通过降低 array、number、objects、string 等等的使用难度从而让 JavaScript 变得更简单。 Lodash 的模块化方法 非常适用于:1.遍历 array、object 和 string2.对值进行操作和检测3.创建符合功能的函数原创 2022-04-26 10:43:20 · 17882 阅读 · 0 评论 -
mac安装vue-devtools
1.到github下载vue-devtools 的压缩包git clone -b add-remote-devtools https://github.com/vuejs/vue-devtools.git2.在vue-devtools目录下安装依赖包cd vue-devtoolssudo npm install然后输入电脑密码(加上sudo为了避免权限问题部分依赖无法安装)3.修改manifest.json文件进入vue-devtools-dev文件夹下的shells .原创 2022-03-22 10:38:14 · 2615 阅读 · 5 评论 -
Jenkins前端自动化部署
为了前端项目的工程化,减少项目发布环境的部署,实现自动化集成打包部署。 本文是针对前端项目和gitlab仓库代码,简述jenkins实现自动化部署的配置流程。原创 2021-12-06 15:00:00 · 1192 阅读 · 0 评论 -
vue中使用防抖和节流
一、防抖定义:频繁操作防止抖动,在操作后 n 秒内不操作,才触发事件,若继续操作,则重新计时场景:输入框输入 缩放resize/** utils.js* immediate 是否开始立即执行*/function debounce(func, delay = 300, immediate = false) { let timer = null return function() { if (timer) { clearT原创 2021-12-02 11:24:25 · 321 阅读 · 0 评论 -
Element ui tree树形控件获取当前节点id和父节点id
第一种情况:在有复选框的情况下方法一1.找到node_modules/element-ui/lib/element-ui.common.js文件2.按Ctrl+F搜索TreeStore.prototype.getCheckedKeys这个方法,低版本教程到这一步就直接修改了(具体看上面教程),发现没有找到if(node.checked) 如图:但可以发现它return this.getCheckedNodes 我们搜索这个方法试试(其实这个函数就在当前函数的上面)。如图:将上..原创 2020-11-26 11:05:10 · 7028 阅读 · 0 评论 -
Element UI 表格 show-overflow-tooltip 设置宽度以及内容换行
前言用vue+element ui框架,用到table表格,如果每列显示的内容过长则可以使用该属性,即:show-overflow-tooltip="true",该属性可以让内容在一行显示,如果显示不下时,显示...,并且鼠标划过时显示全部文字。通常会出现这样的效果:一、设置show-overflow-tooltip宽度样式代码如下:注意:可以在全局添加这样全部生效,如果不想加在全局的话,可以单独加在页面当中,但是切记修改elementui自带样式的话,不能在<style sc..原创 2020-11-02 13:49:32 · 34947 阅读 · 4 评论 -
Vue中Form报表单v-model动态生成
后台数据结构:var PropertiesArray = [ { "propertyId": 1, "propertyName": "url", "description": null, "serial": null, "dataSourceTypeId": "db" }, { "propertyId": 2, "propertyName": "driver", "descript原创 2020-07-31 15:40:27 · 1711 阅读 · 0 评论 -
Vue实现数字翻牌器效果
<template> <div> <div class="head" @click="this.numFun(0,5000)">点击金额变动</div> <div>{{amount}}</div> </div></<template> <script>export default { data () { return { amount: 0 .翻译 2020-07-16 17:32:48 · 6222 阅读 · 0 评论 -
webpack + vue 打包生成公共配置文件(域名) 方便动态修改,不用重复打包
需求: 原来的项目中域名是打包到项目里面的,打包后不能动态配置,只能通过不同的指令打包来切换域名,每天都在测试域名和正式域名来回摩擦,后台大佬说你们可以生成一个配置文件这样就不用频繁打包了直接修改配置文件就好.方法一: vue中有一个存放外部资源的文件夹static,它里面的文件是不会被打包编译的,所以我们就可以利用外部引入js的方式将我们的想要的数据在index.html中以js文件的方式引入,然后就可以全局使用。 此方法亲测有效!!!!1、在...原创 2020-05-17 22:19:11 · 2132 阅读 · 0 评论 -
elementUI+vue-router实现组件动态面包屑导航
vue-cli项目中—根据路由变换的动态面包屑导航1、在src文件夹下的router/index.js中配置路由const routerMap = [ { path: '/', redirect: 'dashboard', component: Layout, name:'Dashboard', ch...原创 2020-01-17 09:32:24 · 3255 阅读 · 0 评论 -
vue2项目实战打包优化(webpack)
一、打包后去掉console和警告(uglifyjs-webpack-plugin)优化方案:修改build文件夹中webpack.prod.conf.js的内容如下:new UglifyJsPlugin({ uglifyOptions: { compress: { unused:true, //是否去掉未关联的函数和变量 warnings: t...原创 2019-12-13 19:51:21 · 1386 阅读 · 0 评论 -
Vue-Router升级导致的 Uncaught (in promise)问题
一、前言 在升级了Vue-Router版本到到3.1.0及以上之后,页面在跳转路由控制台会报Uncaught (in promise)的问题二、原因 V3.1.0版本里面新增功能:push和replace方法会返回一个promise, 你可能在控制台看到未捕获的异常三、解决方法 1、在调用方法的时候用catch捕获异常...转载 2019-10-21 17:41:08 · 3238 阅读 · 0 评论 -
vue-cli使用axios跨域及拦截器的使用
一、axios解决跨域问题1、在main.js中引入axios,并将其设置为vue原型链上的属性,这样在组件中就可以直接 this.$axios使用了import axios from 'axios';Vue.prototype.$axios=axios;2、在config/index.js里面设置ProxyTable代理dev: { // Paths 静态资源文件...原创 2019-10-18 14:36:17 · 689 阅读 · 0 评论 -
Vue--methods watch和compute的区别和联系
一、依赖追踪机制 watch和computed都是以Vue的依赖追踪机制为基础,它们都试图处理这样一件事情:当某一个数据(称它为依赖数据)发生变化的时候,所有依赖这个数据的“相关”数据“自动”发生变化,也就是自动调用相关的函数去实现数据的变动。 methods用来定义函数,它需要手动调用才能执行,需要像”fuc()”这样去调用它(假设函数为fuc) ...原创 2019-08-02 10:32:55 · 328 阅读 · 0 评论 -
vue--实现axios数据请求
一、下载安装插件npm install axios --save二、下载vue-axiosnpm install --save axios vue-axios三、在src/main.js中,导入axiosimport Vue from 'vue'import axios from 'axios'import VueAxios from 'vue-axios'Vu...原创 2019-07-13 21:37:25 · 211 阅读 · 0 评论 -
解决Vue常见的数据渲染或缓存问题
一、vue路由加载页面时,数据返回慢的问题 vue路由加载页面时,数据返回慢的时候页面会有闪动的效果,数据加载前和加载后的区别。(特别是el-table表格数据)解决方案: 使用vue-router的路由守卫beforeRouteEnter,组件内直接定义以下路由导航守卫,和钩子函数的写法一样,下面列出三种路由守卫: beforeRout...原创 2019-07-07 23:56:18 · 7230 阅读 · 0 评论 -
浅谈Vuex的理解
一、Vuex 是什么? Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化。二、Vuex原理是什么? Vuex实现了一个单向数据流,在全局拥有一个State存放数据,所有修改State的操作必须通过Mutation进行,...原创 2019-07-07 22:46:49 · 319 阅读 · 0 评论 -
vue项目遇到的问题以及解决方案
一、视图无实时刷新问题解决方案:this.$nextTick(function(){ // 需要改变的数据})二、在webAPP时单位的换算window.onresize = function () { document.documentElement.style.fontSize = document.documentElement.clien...原创 2019-05-21 23:29:59 · 15127 阅读 · 0 评论 -
VUE常见知识点
1、Vue的双向数据绑定原理是什么?vue.js 是采用数据劫持结合发布者-订阅者模式的方式,通过Object.defineProperty()来劫持各个属性的setter,getter,在数据变动时发布消息给订阅者,触发相应的监听回调。 具体步骤:第一步:需要observe的数据对象进行递归遍历,包括子属性对象的属性,都加上 setter和getter这样的话,给这个对象的...原创 2019-04-28 17:32:54 · 483 阅读 · 0 评论