vue

Vue的介绍

一 Vue简介 Vue(读音 /vjuː/,类似于 view) 是一套用于构建用户界面的 渐进式框架 与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用 Vue 的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项目整合 官网:https://cn.vuejs.org/ 二 Vue ......
Vue

Vue多层级组件传递动态具名插槽

这里以一个table组件的二次包装为案例,父组件中使用子组件(table组件)再次包装: Vue2: 子组件,inTable <template> <table> <thead> <tr> <th v-for="(item, index) of columns" :key="index"> {{ i ......
多层 组件 动态 Vue

Vue学习七:自定义创建项目和vuex

一、自定义创建项目 默认的项目有很多包不全,需要的时候还要导包搭架子,因此我们可以自定义创建项目。 选择的项目按照自己需要的设置,可参考如下参数设置。(eslink是一种代码规范) 二、vuex 1、vuex概述vuex是一个vue的状态管理工具,状态就是数据。大白话: vuex 是一个插件,可以帮 ......
项目 vuex Vue

Vue3+vite路由配置优化(自动化导入)

今天在维护优化公司中台项目时,发现路由的文件配置非常多非常乱,只要只中大型项目,都会进入很多的路由页面,规范一点的公司还会吧路由进行模块化导入,但是依然存在很多文件夹的和手动导入的问题。 于是我想到了我之前使用vuex时进行的模块化自动导入js文件,能不能使用到自动导入.vue文件中去,答案是可以! ......
路由 Vue3 vite Vue

vue 的 name 和最外层 class命名也需要保证唯一性

平时为了赶工期,在画页面的时候,会复制框架里面相同样式的页面,直接Ctrl+A Ctrl+C Ctrl+V 然后修改字段。 这样写节省不少时间,也提高了效率。 但是是有隐患的, 首先是vue的name,挺重要的比如keepalive时候,exclude include 的name就需要保持一致。(之 ......
唯一性 外层 class name vue

vue + ElementUI 表格表头筛选数据过多,让筛选框显示滚动条

代码参考: .el-table-filter { max-height: 300px; overflow: auto; } 因为,表头筛选功能是引入的element ui的第三方组件,当我们的样式写了scoped进行了样式管控只适用于当前组件时,而又不想去除scoped属性造成组件之间的样式覆盖。这 ......
表头 ElementUI 表格 过多 数据

Vue中的scoped的实现原理以及scoped穿透的用法

参考:https://devpress.csdn.net/viewdesign/6410196b986c660f3cf923db.html?spm=1001.2101.3001.6650.5&utm_medium=distribute.pc_relevant.none-task-blog-2%7Ed ......
scoped 原理 Vue

vue增长改查模版

1.前言 后台管理系统,基础信息录入的页面都是表格+弹窗形式的增删改查,依此进行封装,减少重复开发 涉及组件:表单,表格,分页,弹窗 涉及接口:列表查询,新增提交,编辑提交(整行) 2. ......
模版 vue

少年,该升级 Vue3 了!

Vue2 的终止支持时间是 2023 年 12 月 31 日,本文是一篇 Vue2 升级 Vue3 的指南,可帮助你快速从 Vue2 平滑升级到 Vue3。 ......
少年 Vue3 Vue

vue3 computed属性

该随笔是根据b站小满zs的Vue3 + vite + Ts + pinia + 实战 + 源码 +electron的视频学习写的,Vue3 + vite + Ts + pinia + 实战 + 源码 +electron ......
computed 属性 vue3 vue

vue elementplus 使用cellRenderer重写单元格,滑动滚动条渲染复选框出现错误

使用elementplus的虚拟表格,动态加载表头的时候,第一列为复选框;但是在滚动滑动条的时候出现了一个奇怪的现象; 我选择了4和5,当我滑动滚动条的时候如下: 像是复选框跟着在动; 通过跟踪代码,查出问题; 在cellRenderer中打印checked的值发现问题,大滚动的时候,打印出来的都是 ......
cellRenderer elementplus 单元 错误 vue

vue2和vue3使用echarts时无数据,怎么显示暂无数据图片或文字

一开始也经历了用v-if和v-show,v-show的话echarts还会留出暂无数据图片的位置,导致echarts变形,v-if在加载和不加载切换时,dom会获取不到;后来也是在网上找的方法,时间有点长,原文地址就不贴了。 对了,在网上查方法的时候还找到了echarts noDataLoading ......
数据 vue echarts 文字 图片

vue 自定义全局弹窗组件

问题描述: vue 自定义类似 elementUI 的 this.$confirm 解决方案: 通过vue 的extend 方法实现 然后全局注入 代码实现: 展示的组件 (就是最基本的vue组件代码) <!-- * @Author: linchun linchun * @Date: 2023-09 ......
全局 组件 vue

从零开始使用vue2+element搭建后台管理系统(动态表单实现(含富文本框))[待完善]

在后台项目的实际开发过程中,涉及到表单的部分通常会使用动态渲染的方案进行实现,由后端接口返回表单配置,前端进行遍历渲染。考虑到通用后台需要具备的功能,除了基础的表单项如输入、下拉、多选、开关、时间、日期等,还需要具备上传、富文本框等功能。 首先导入一个百度来的富文本框插件:npm install v ......
表单 后台 管理系统 文本 element

.Net core 3.0 SignalR+Vue 实现简单的IM(无jq依赖)

.Net core 中的SignalR JavaScript客户端已经不需要依赖Jquery了 一、服务端 1、nuget安装 Microsoft.AspNetCore.SignalR2、在startup.cs中注册和使用signalr services.AddSignalR(); app.UseE ......
SignalR core Net 3.0 Vue

vue项目用electron打包成exe,并更新exe版本

用electron-build打包 1、下载electron、electron-builder npm install electron electron-builder -D 2、配置package.json文件 "start": "electron .", "app:build": "elect ......
exe electron 版本 项目 vue

vue3 ts setup 监听 pinia 数据的变化,更新页面数据

简述 由于 pinia 导入到vue中的值没有响应性 import useUserStore from './stores/user'; const userStore = useUserStore(); userStore.isvaild;// 没有响应性 那么我们在vue中动态修改某值的想法则需 ......
数据 页面 setup pinia vue3

vue+openlayers 绘制点

绘制点使用point在绘制点的位置,使用Circle绘制点的样式 疑问:将style放在Feature上就绘制不出来样式? <template> <div class="setting"> <div class="title">设置</div> <ul> <li> <p>边框大小:</p> <el- ......
openlayers vue

Spring Boot + Vue3前后端分离实战wiki知识库系统<十三>--单点登录开发二

接着https://www.cnblogs.com/webor2006/p/17608839.html继续往下。 登录功能开发: 接下来则来开发用户的登录功能,先准备后端的接口。 后端增加登录接口: 1、UserLoginReq: 先来准备用户登录的请求实体: package com.cexo.wi ......
知识库 实战 知识 Spring 系统

highlight_highlight.js在vue项目中的基本用法

目录简介安装使用在vue项目中的使用附录获取可选的样式文件快速获取可选样式 简介 highlight.js是一个将代码html, 即通过<pre>标签包裹的<code>标签内的代码字符串文本赋予样式的插件; 安装 npm i highlight.js -S 使用 在vue项目中的使用 在main.j ......
highlight highlight_highlight 项目 vue js

uniapp 在app.vue中的异步请求完,页面中的onload或者onshow再请求(promise方法)

第一步: 在main.js里面注册onLaunched,onLaunched,onLaunched,isResolve // 处理onLaunch和onLoad 异步变成同步问题 app.config.globalProperties.$onLaunched = new Promise((resol ......
promise 页面 方法 uniapp onload

Vue3.2

1.ref定义基本数据类型 <script setup> import {ref} from 'vue' //需导入依赖 let name = ref('zhangsan') const setName = () => { name.value = 'lisi' } </script> const ......
Vue3 Vue

uniapp中使用vue-i18n实现多语言

一 安装vue-i18n npm i vue-i18n@6 二 添加相关语言配置 如 en.json: { "locale.auto": "System", "locale.en": "English", "locale.zh-hans": "简体中文", "locale.zh-hant": "繁体 ......
uniapp vue-i vue 18

Vue mavon-editor 本地加载 – 关闭 CDN

​ 转载自Vue mavon-editor 本地加载 – 关闭 CDN - 前端教程。仅自用。 时间 2022-03-31 21:07:09 前言 在 Vue 里面使用 Markdown 编辑器的选择并不多。mavon-editor 大概是 GitHub 上星星最多的 Vue Markdown 编辑 ......
mavon-editor editor mavon Vue CDN

关于vue2的模块级总结

前阵子在赶一个项目的进度,一直没时间做总结,今日闲来无事,消化一下。 背景 vue2的项目,面向受众为g端 内容 1. 项目原因,单路由下包含详情&列表两页面。根据v-if跳转,笔者这里用的是动态组件的方式 2. 同样由于项目原因,使用的模块级vuex,因而在使用时,也有了许多盲点: (如图:) 使 ......
模块 vue2 vue

vue项目中的Tinymce富文本编辑器如何从word中粘贴图片上传到七牛云

Tinymce富文本编辑器粘贴图片时需要上传到自己的空间中才能被打开。 一、首先需要安装引入七牛云 npm install qiniu-js var qiniu = require('qiniu-js')// orimport * as qiniu from 'qiniu-js' 二、同时引入客户端 ......
编辑器 文本 Tinymce 项目 图片

Vue学习六:路由进阶

一、路由的封装抽离 目标:将路由模块抽离出来。好处:拆分模块,易于维护。 第一步:在src目录下新建一个router目录,在创建一个index.js文件,将先前main.js中的路由代码转移到index.js文件中。(这里需要使用到vue所以需将vue包导入;需修改组件路径,@符号代表绝对路径src ......
路由 Vue

报错error Component name "Index" should always be multi-word vue/multi-word-component-names解决方法

1、问题说明:在创建组件命名时,引用 index.vue 的过程中报错; 2、报错的原因及分析:其一、报错的全称为:error Component name "index" should always be multi-word vue/multi-word-component-names翻译为:错 ......

添加Element ui依赖报错:npm ERR code EPERM,syscall mkdir, npm ERR! path D:\Vue\nodejs\node_cache\_cacache\index-v5\f3\de

添加Element ui依赖报错:npm ERR code EPERM,syscall mkdir, npm ERR! path D:\Vue\nodejs\node_cache\_cacache\index-v5\f3\de 具体报错信息如下: 我这个是在IDEA控制台输入 npm i eleme ......
node_cache ERR npm Element cacache

vue2 使用tinymce编辑器实现上传图片及粘贴word文本保留格式并粘贴图片自动上传

下载对应的版本 npm install @tinymce/tinymce-vue@3.0.1 -Snpm install tinymce@5.8.2 -S 然后在node_modules中找到tinymce把整个文件复制下来粘到public中 在组件页面使用 根据自己需求进行注释或添加功能 <tem ......
图片 编辑器 文本 tinymce 格式