表头 图标vue3 vue

新员工入职,前端基础环境变量的配置!node、nvm、vue-cli的安装和下载

1.安装nvm及配置 首先下载nvm不要下载node,如果电脑已经有node的话需要卸载node,并使用命令提示符来查看node的位置(where node)手动删除 nvm下载链接:https://nvm.uihtm.com/ 下载最新版本,next傻瓜式操作(需要注意的是) 选择node.js文 ......
前端 变量 员工 vue-cli 环境

Vue3中的Component之间的消息传递

Vue3中的父子之间的消息传递可以通过Emit进行消息传递.详细参见Vue3的官方文档Event的说明https://vuejs.org/guide/components/events.html#declaring-emitted-events 官网中的文档读起来稍微有点费解,这里阐述一下,其实就是 ......
Component 之间 消息 Vue3 Vue

vue项目中发布新版本线上自动清缓存

背景 最近项目更新频繁,每次一更新客户都说还跟之前的一样。一查原因是因为客户没有清空浏览器的缓存。所以为了方便客户看到最新版本,开始调研再发布新版本后自动清理缓存。 方案 每次打包后的js和css都加上hash值后缀。当文件发生改变时,hash值也改变。这样就不会走缓存 举个例子 vue.confi ......
缓存 项目 vue

Mapboxgl 动态添加多种颜色、形状的图标

适用场景: 需要在地图上展示很多种数据,这些数据使用的图标形状是有限的几种,但颜色可能由后台自由配置后传给前端。 数据种类可能会变化,颜色可能会变化,这种情况下让设计同事切一堆图反而不方便维护,使用动态加载图标可以一定程度上节省前端的后期工作。 前端框架是vue3+vite,其他框架能否实现未验证。 ......
多种颜色 图标 形状 Mapboxgl 多种

用Abp实现两步验证(Two-Factor Authentication,2FA)登录(二):Vue网页端开发

@ 前端代码的框架采用vue.js + elementUI 这套较为简单的方式实现,以及typescript语法更方便阅读。 首先添加全局对象: loginForm: 登录表单对象 twoFactorData: 两步验证数据, showTwoFactorSuccess: 是否显示两步验证成功提示 l ......
Authentication Two-Factor 网页 Factor Abp

Vue3+element-plus封装文字超出一行,省略号显示,鼠标悬浮展示全部

1.组件封装 <template> <el-tooltip effect="dark" :disabled="isShowTooltip" :content="content" placement="top"> <p :class="['line1', className]" @mouseover= ......
省略号 element-plus 一行 鼠标 element

Vue.js 路由的props配置

视频 index.js(解构赋值,连续解构赋值) Message.vue 7.路由的props配置 ​ 作用:让路由组件更方便的收到参数 { name:'xiangqing', path:'detail/:id', component:Detail, //第一种写法:props值为对象,该对象中所有 ......
路由 props Vue js

记录下Mac下制作icns图标的流程

创建一个文件夹 必须要以iconset为后缀 mkdir hgl_pngpic.iconset 使用sips命令生成 10张小图 sips -z 16 16 $hgl --out hgl_pngpic.iconset/icon_16x16.png sips -z 32 32 $hgl --out h ......
图标 流程 icns Mac

Vue3+Vite 动态修改svg图片颜色

首先需要以组件形式使用svg,请先看这篇文章:vite中加载使用svg 可能是跟原博主使用的svg格式不同,用:style="{ color: color }"修改颜色不生效,因此做了一点修改,此修改适用的svg如下: 在iconfont官网收藏下载的svg格式图标,打开文件删除其中的fill=xx ......
颜色 动态 图片 Vue3 Vite

Vue+echarts实现中国地图射线效果

效果图如上 前提是安装Echarts并引入 并且配置中国地图json文件这些都在同账号另一篇博客上有说明,查看请自行移步 下展示代码 <template> <div class="managingPatientSize"> <el-row> <el-col :span="6">1</el-col> ......
中国地图 射线 效果 echarts 地图

uni-app vue2升级vue3过程中遇到的问题总结

首先是在升级的过程中,项目跑不起来,相关的问题不贴图了,解决办法简单粗暴,就是卸载,重装最新版Hbuilder X。可以解决一大部分问题。 再次,会出现如下报错: 是因为我在main.js中app.use 的问题,直接注释。然后发现还有如下问题: 排查了好久才发现,是因为写在app.vue中的检测小 ......
vue 过程 uni-app 问题 vue2

Vue项目使用Echarts来实现中国地图,省份显示

当时做的时候参考了CSND博主:接口写好了吗 第一步:下载echarts npm install echarts --save main.js中引入 import * as echarts from 'echarts'; 第二步:引入china.json文件 创建utils文件夹,在内创建china ......
中国地图 省份 Echarts 地图 项目

vue2项目搭建

1安装 脚手架和打包工具 创建项目 npm install -g vue-cli npm install -g webpack vue create 项目名 创建vue项目时报错:vue : 无法将“vue”项识别为 cmdlet、函数、脚本文件或可运行程序的名称。请检查名称的拼写,如果包括路径,请 ......
项目 vue2 vue

Vue2电商实战项目(二)

最新接口请求地址 - http://gmall-h5-api.atguigu.cn/ - 示例: http://gmall-h5-api.atguigu.cn/api/product/getBaseCategoryList axios二次封装 - 前端请求方法大概有这几种: XMLHttpReque ......
实战 项目 Vue2 Vue

vue属性之监听属性(watch)

简介 当一个变量的值发生变化时,执行对应的函数 语法 # 在属性中添加watch属性,并以需要监听变量的名字进行定义函数 data:{show: 'abc'} watch:{ show(){ 我是函数内容 } } 示例 <!DOCTYPE html> <html lang="en"> <head> ......
属性 watch vue

Mapboxgl draw 自定义标绘之二:图标、文本、圆形的创建与编辑,重写原模式相关方法,保持当前模式

mapbox-gl-draw官网给出的扩展模式终于无法满足需求,需要diy了。 因为是diy,所以不存在前文说的commonjs打包报错的问题,呵呵。 前文:Mapboxgl draw 自定义标绘:圆、矩形、自由多边形、上传读取geojson (有的概念可能会接续前文不做解释) 参考链接 自定义MO ......
模式 圆形 图标 Mapboxgl 文本

vue之计算属性(computed)

简介 在vue中,如果在methods中定义了一个函数,也是可以通过插值语法调用的,但会产生一个问题,如果有多个输入框使用了v-model,这时不管输入的内容是否与这个函数有关,这个函数都会执行一次,这样会让降低运行效率,为了解决这个问题,可以使用计算属性 计算属性效果: 计算属性只有在它的相关依赖 ......
computed 属性 vue

vue项目通过外部配置文件读取接口地址- 在webpack-index.html模板中使用环境变量

概述:在index.html模板中判断当前环境,处于开发环境下时读取process环境变量、处于生产环境下时读取根目录配置文件(./config.js),两种环境下将配置统一挂载到window全局变量上(SET_CONFIG) config.js window.SITE_CONFIG = { app ......
webpack-index 变量 接口 模板 webpack

vue之组件

简介 组件(component)是vue.js最强大的功能之一。组件的作用就是封装可重用的代码,通常一个组件就是一个功能体,便于在多个地方都能够调用这个功能体。 每个组件都是Vue的实例对象。 我们实例化的Vue对象就是一个组件,而且是所有组件的根组件 在工程化工发后,一个组件就是一个 xxx.vu ......
组件 vue

转载:IconFont(矢量图标字体)在Winform中的应用

一、前言 很多时候,使用矢量图形可以带来非常美观的界面效果,比如SVG的使用。但是Winform原生是不支持显示SVG图像的,所以退而求其次,可以使用IconFont来实现相似的矢量效果。 先来个图解解馋: 知识点:资源文件中字体的使用方法、IconFont使用方法、IconFont应用场景示例、I ......
矢量 图标 IconFont 字体 Winform

vue 文件拖拽上传功能

现在,很多web端操作都喜欢使用拖拽上传功能。此方法使用起来也很简单,主要是使用 ondrop 和 ondragover 两个事件。 在vue中是这样的 <div class="upload-file-box" v-loading="loading" @drop="dropFile($event)" ......
功能 文件 vue

微信小程序使用 iconfont 彩色图标

小程序不能使用SVG字体,所以iconfont 里可以使用彩色图标,可以简单的解决。 注意:iconfont 彩色 一个项目不能超过40个图标 ......
图标 iconfont 彩色 程序

delphi 如何给自开发的组件设置图标?

经过其他老师指点,自己摸索,发现如何实现,现说明如下,供大家参考。一、建立图标文件 1、建立一个24X24的256色BMP格式文件。 2、文件命名为该组件的名称。二、建立资源文件:Project→Resource and Images,点击Add将BMP格式图标文件加入,Resource Ident ......
图标 组件 delphi

1.Vue的基本原理

当一个Vue实例创建时,Vue会遍历data中的属性,用Object.defineProperty(vue3.0使用proxy)将它们转为getter/setter,并且在内部追踪相关依赖,在属性被访问和修改时通知变化。每个组件实例都有相应的watcher程序实例,它会在组件渲染的过程中把属性记录为 ......
原理 Vue

Vue3快速上手

Vue3快速上手 1.Vue3简介 2020年9月18日,Vue.js发布3.0版本,代号:One Piece(海贼王) 耗时2年多、2600+次提交、30+个RFC、600+次PR、99位贡献者 github上的tags地址:https://github.com/vuejs/vue-next/re ......
Vue3 Vue

Vue 项目打断点

相关链接: https://www.jianshu.com/p/bedb5c2d6420 ......
项目 Vue

Winform-自定义按钮_三色灯图标

using System; using System.Collections.Generic; using System.ComponentModel; using System.Drawing.Drawing2D; using System.Drawing; using System.Linq; ......
图标 按钮 Winform

Winform-自定义按钮_播放图标

using System; using System.Collections.Generic; using System.ComponentModel; using System.Drawing.Drawing2D; using System.Drawing; using System.Linq; ......
图标 按钮 Winform

1.Vue的基本原理

当一个Vue实例创建时,Vue会遍历data中的属性,用 Object.defineProperty(vue3.0使用proxy)将它们转为 getter/setter,并且在内部追踪相关依赖,在属性被访问和修改时 通知变化。每个组件实例都有相应的watcher程序实例,它会在组 件渲染的过程中把属 ......
原理 Vue

3. Vue系列学习笔记 - Vue组件

定义Vue组件 什么是组件: 组件的出现,就是为了拆分Vue实例的代码量的,能够让我们以不同的组件,来划分不同的功能模块,将来我们需要什么样的功能,就可以去调用对应的组件即可;组件化和模块化的不同: 模块化: 是从代码逻辑的角度进行划分的;方便代码分层开发,保证每个功能模块的职能单一; 组件化: 是 ......
组件 Vue 笔记