样式 组件scoped vue
element ui的Upload 上传和Image 图片组件使用整理
说明 收集整理在开发中遇到的对于上传组件和图片组件的使用 Upload上传组件 修改上传按钮的默认宽高 ::v-deep .el-upload--picture-card { width: 80px; height: 80px; line-height: 85px; } 修改默认的上传组件图片列表展 ......
Vue3.3 的新功能的一些体验
Vue3 在大版本 3.3 里面推出来了一些新功能(主要是语法糖),网上有各种文章,但是看起来似乎是一样的。 我觉得吧,有新特性了,不能光看,还要动手尝试一下。 DefineOptions 宏定义 先来一个简单的,以前我们有时候想设个name,有时候不想让组件自动继承属性,这时候需要单独设置一个sc ......
vue嵌套iframe踩坑
iframe修改src不触发刷新 在vue中通过v-bind绑定src <iframe sandbox="allow-same-origin allow-scripts allow-forms" ref="iframe_page" :src="pageSrc" style="display:bloc ......
vue父组件调用子组件的方法
父组件中写法: <div style="padding: 10px"> <columnTwo ref="child" style="height: 200px;" :columnDataName="columnDataName" :columnData="columnData"></columnTw ......
vue3项目国际化,你还不了解吗?
vue3使用的国际化库为:i18n 安装方式: npm install vue-i18n@next 安装完成后在src文件夹下新建lang文件夹 在lang文件夹下新建需要语言转换的文件夹,这里以中文zh和英文en举例,在这两个文件夹下新建需要转换的语言 在zh的index.ts中写好我们需要转换的 ......
从0到1搭建后台管理系统(Vue3 + Vite4 + TypeScript + Element Plus + Pinia + Vue Router )
参考有来:https://www.cnblogs.com/haoxianrui/p/17331952.html Node 16+ 版本大于16【问题一:目前我是14.18.2的版本npm是6.14.15版本,这就涉及到要切换node版本的问题,不然我安装了16我的vue2项目就启动不了了】 vsco ......
vue 父子组件生命周期执行顺序
挂载阶段执行顺序为:父beforeCreate -> 父created -> 父beforeMount -> 子beforeCreate -> 子created -> 子beforeMount -> 子mounted -> 父mounted 更新阶段执行顺序为:父beforeUpdate -> 子b ......
vue3+element-plus Calendar 日历组件添加农历、节假日
创建一个vue文件 <script setup lang='ts'> import { ref } from "vue"; import calendar from "./lunarDay";//引入农历、节假日计算方法 defineOptions({ name:'CusCalendar' }) c ......
vue请求后端数据和跨域问题
最近遇到的一个问题 后端写好的接口,前端怎么获取数据 这是我后端的接口:GET 接口 这是我前端运行的项目地址: 简单使用: 咱门前端使用 颇受好评的 axios 来发起请求 这是它的官网:https://www.axios-http.cn/ 不过要在vue中使用它,就需要先安装 打开终端 输入一下 ......
vue8小时带刻度的时间轴,根据当前时间实时定位
效果图: 需求: 1 开始时间、结束时间可配置2 时差固定8小时3 根据当前时间初始化位置4 每隔5s刷新位置5 超过结束时间停止刷新 HTML: <div class="time-axis"> <div class="startTime">{{start_time}}</div> <div cla ......
vue3+ swiper8
swiper是一个非常好用的图片切换组件,但是vue3 + swiper8 版本的文档看上去会有点懵逼(一部分是因为版本太多了,一部分是因为很少用) 此处记录下我的使用方法: 安装: npm i swiper 按照官网来使用: html部分:(基本上常用的也就这些啦,在复杂的就真的要去啃书啦) <s ......
vue实现下拉懒加载
<template> <div class="ele-body infinite-wrapper" style="height: calc(100vh - 235px); overflow: auto" > <div class="columns" v-loading="loading"> <div ......
uni-app图片剪切上传;uview2用使用uview1中的图片剪切上传组件,把原有代码抽取出来
1.其实是个组件页面,移过来就行了。 2.原有组件中,可视区域和截图结果区域的长宽是一样的,所以需要调整一下; 3.因为剪切图片,是在一个单独页面实现的.所以pages.json中需要加上剪切的页面路径; pages.json { "path": "components/u-avatar-cropp ......
Vue 前端开发团队风格指南(史上最全)
Vue官网的风格指南按照优先级(依次为必要、强烈推荐、推荐、谨慎使用)分类,本文根据项目实际情况整理了一份适用于团队开发的vue风格指南,供大家参考。 ......
CSS 默认样式
outline: Chrome浏览器默认为-webkit-focus-ring-color auto 1px; webkit-focus-ring-color默认为rgb(16, 16, 16);这个值不会变,但是浏览器可能对其他的属性进行了处理,导致了focus元素时会根据背景色的不同产生不同的对 ......
PV_SPS_Model:基于MATLAB/Simulink的光伏组件串联部分遮阳仿真模型。
PV_SPS_Model:基于MATLAB/Simulink的光伏组件串联部分遮阳仿真模型。仿真条件:MATLAB/Simulink R2015bID:3635660069130461 ......
VUE ELEMENT-UI无法用右上角的“X”关闭,取消按钮可用
VUE ELEMENT-UI无法用右上角的“X”关闭,取消按钮可用 原因:清空方式有问题 我定义的要打开的表单: addElementForm: { title: "配置产品要素", dialogFormVisible: false, prod_name: [], prod_code: [], us ......
CSS学习1 认识CSS;三种CSS的编写样式;CSS注释;常见的CSS样式;元素link;CSS颜色表示方法;浏览器开发者工具;浏览器的渲染流程
1_认识CSS what:为网页添加样式(美化界面);一门样式表语言,不是编程语言 发展历史 css1(两个人合作发布) css2(w3c) css3(模块化持续发展中) 总结:美化HTML,让HTML与CSS分离 方式一:添加样式,例如颜色、字体,大小 方式二:布局,按照某种结构显示 2_三种CS ......
vue3拾遗(不定期更新)
props传参 会自动跳过key/ref/...等本身就有特殊意义的属性名 路由跳转 当路由到同一个路由组件时,会依次触发onBeforeUpdate、onUpdated生命周期钩子 ......
nginx部署vue项目显示空白页
报错提示: index-fbb90c85.js:1 Failed to load module script: Expected a JavaScript module script but the server responded with a MIME type of "text/plain". ......
自定义 li 标签序列的样式
第一步删除 li 标签的默认样式,取消 ::mark 代理样式(默认样式)。第一步已经把默认样式取消了,自然没有了序号,使用 CSS 的 counter() 函数和 counter-increment 属性来自定义序列号。 通过 list-style-type: none 删除 li 标签的默认样式 ......
(elementUI)el-cascader级联多选,高宽样式的处理(一行显示)
一、问题:当级联选择器设置多选属性时,输入框的高度会被撑开,如下图所示 二、解决办法1.给el-cascader设置multiple和collapse-tags属性(多选模式下折叠Tag),如下 <el-cascader :options="options" :props="{multiple: t ......
小程序开发中的插件、组件、控件到底有什么区别?
小程序插件代码由一些自定义组件和 JS 代码文件构成,插件开发者在发布插件时,这些代码被上传到后台保存起来。当小程序使用插件时,使用者需填写插件的 AppID 和版本号,就可从后台获取相应的插件代码。小程序代码编译时,插件代码会被嵌入到小程序中,与小程序一起编译运行。 ......
解决vue中路径中的多一个#
本文要解决的问题是在vue项目中,主路径和vue路径中多一个# 这个东西只需要改一个这个就行 vue-router的mode: ‘history’ const router = new VueRouter({ mode: 'history', routes: [...] }) ......
用print-js实现打印功能时element table组件打印不全的问题
插件下载: npm install --save print-js 解决方案,修改print.js里面的 getHtml // 打印类属性、方法定义 /* eslint-disable */ const Print = function (dom, options) { if (!(this ins ......
vue移动端实现调用相机扫描二维码或条形码
一、首先下载需要的插件 npm install @zxing/library --save 二、假设场景:页面上有个按钮,点击触发扫码功能 @click='scanCode()',在 methods 写入该方法。 scanCode() { console.log('浏览器信息', navigator ......
React笔记-样式(二)
React学习笔记-样式(二) 内联样式 import React from "react"; export default class LearnStyle extends React.Component { render () { return ( <div> {/* 以下两种方法都可以 一种不 ......
React笔记-组件(一)
React学习笔记-组件(一未完成) 特点 声明式 组件化 跨平台 React脚手架 a. 全局安装react脚手架 create-react-app npm install create-react-app -g & npx create-react-app my-app b. 使用create- ......
java基于ssm+vue药品商超进销存管理系统,附源码+数据库+文档+PPT,适合课程设计、毕业设计
1、项目介绍 使用药品管理系统的分为管理员和用户、员工三个权限模块。 管理员所能使用的功能主要有:首页、个人中心、用户管理、员工管理、药品类别管理、药品信息管理、药品入库管理、药品出库管理、在线咨询管理、留言板管理、系统管理、订单管理等。 用户可以实现;首页、个人中心、在线咨询管理、我的收藏管理、订 ......
使用vue的keep-alive缓存组件,三级菜单组件无法缓存问题解决
使用vue做后台管理系统,需求是所有的菜单打开之后,下次点击的时候的使用缓存,这里很简单的做法就是用来包裹住;但是一级菜单和二级菜单都没有问题,三级菜单就会出现无法缓存的问题,网上找资料说是vue中keep-alive本身存在的缺陷,需要在路由守卫中将matched属性做一下优化,具体如下 // 处 ......