变量vue3 vue css
vue 横向滚动菜单点击居中
最近在写项目的时候遇到一个功能 vue 横向滚动菜单实现点击 元素滚动可视区域居中，网上找了一些轮子都不是很好用，决定自己写一个，话不多说，开撸 先上效果如下，点击后面item可自动滚动到可视区域 在template中的代码 <div class="navbar-list"> <div class= ......
Vue的$nextTick完成后获取渲染后的dom数据
问题是这样滴： 需要在div的内容更新后获取div的高度，如果在更新值后马上获取，则高度还是之前的，需要在$nextTick中获取，但是呢这个高度需要返回给上层函数用做比较，所以就想$nextTick返回后在处理，搜索后发现$nextTick是处理异步的一个回调函数，它返回的是一个promise对象 ......
el-dialog在vue3中的应用
一般根据文档给到的demo，其中:visible.sync控制显示隐藏，我实测不行的呢?改用v-model=“dialogVisible”来实现 <template> <el-dialog title="提示" :visible.sync="dialogVisible"> <!-- 对话框内容 -- ......
vue全家桶进阶之路20：ECMAScript脚本语言规范
ECMAScript（简称 ES）是一种由 Ecma 国际组织定义的脚本语言标准，它定义了 JavaScript 语言的基本规范和特性。JavaScript 是一种基于 ECMAScript 标准的编程语言，因此 ECMAScript 对于 JavaScript 开发来说非常重要。 ECMAScri ......
ubuntu查看和修改PATH环境变量
总结：path变量其实存储在/etc/environment文件中，如果要重置PATH只需要source /etc/environment 1、查看PATH echo $PATH 2、修改PATH 修改ubuntu中PATH的方法： 直接修改$PATH值； 通过修改.bashrc文件进行设置； 通过 ......
标识符、基本数据类型、变量、
1.标识符 变量名、常量名、类名、对象名、方法名，凡事自己子程序中定义使用的文字，就是标识符 命名规范 以任何英文字母,下划线_开头的开始，美元符号$ 跟随着任何字母、数字、下划线_和美元符号$ 最多可有255个字符 不可使用java关键字 2. java基本数据类型 2.1八大基本数据类型 | 类 ......
Vue和JS前端网页下载保存图片到本地电脑中
//保存图片 clickSaveImage(url) { let image = new Image(); // 解决跨域 canvas污染问题 image.setAttribute('crossOrigin', 'anonymous') image.src = url + '?time=' + n ......
VUE SSR
1 简介 概念：ssr（server side render）服务端渲染 优点： 1.有利于搜索引擎的SEO操作，由于搜索引擎爬取的是完全渲染出来的页面。 2.对于网络慢或运行慢的设备，可提供良好的用户体验。 3.可以减少对服务器的请求。 缺点： 1.开发受限制，比如mounted生命周期钩子不能用 ......
vue全家桶进阶之路19：webpack资源打包工具
Vue.js 是一个前端开发框架，它可以帮助我们快速构建单页应用和复杂的交互界面。而 Webpack 则是一个前端资源打包工具，它可以将多个 JavaScript、CSS、HTML、图片等资源打包成一个或多个文件，并提供模块化加载、压缩、混淆等功能，以便于前端开发和部署。 在使用 Vue.js 开发 ......
伪元素和CSS类
伪元素可以结合CSS类： p.article:first-letter {color:#ff0000;} <p class="article">文章段落</p>https://www.lekaowang.com/cjhjs/zx/ksdg/ 上面的例子会使所有 class 为 article 的段落 ......
CSS - :before 伪元素
":before" 伪元素可以在元素的内容前面插入新内容。 下面的例子在每个 <h1>元素前面插入一幅图片： 实例 h1:before { content:url(smiley.gif); } https://www.lekaowang.com/jjcy/dgw/aesh/ 翻译 搜索 复制 ......
vue3 中 pinia 的 state 修改模版绑定的 state 数据没更新？
解决方案： 给 state 增加 computed import { useLayerStore } from "@/stores/"; const layer = useLayerStore(); const layerList = computed(() => layer.layerList); ......
webstorm运行Vue项目环境配置(如何从0配置运行一个写好的vue项目)
1.在Node官网上下载zip安装包。 网址：https://nodejs.org/dist/v16.14.0/ （需要哪个版本就把/v后的版本号改成哪个版本） 2.下载完成后解压至需要的文件夹下。 3.在此文件夹下新建两个文件夹： node_cache：npm缓存路径 node_global：np ......
超全、超简单Vue微信公众号授权登录指南
<template> <div id="app"> <h1>微信授权登陆</h1> <div> <div> <span>手机号</span> <input type="number" :value="account" placeholder="请输入手机号"> </div> ......
vue2实现路由懒加载
以下内容仅供学习使用 安装@babel/plugin-syntax-dynamic-import插件。 1.1 使用npm安装： npm install --save-dev @babel/plugin-syntax-dynamic-import 1.2 使用yarn安装： yarn add --d ......
VUE实现购物车界面
以下是一个用 Vue.js 实现购物车的简单示例： 在 Vue 组件中定义购物车数据： data() { return { cart: [], total: 0 } } 在商品列表或详情页中添加“加入购物车”按钮，并绑定添加购物车方法： <button @click="addToCart(produ ......
Vue中watch和computed的区别和应用场景
watch中的函数是不需要调用的，computed内部的函数调用的时候不需要加()。Watch是属性监听，监听属性的变化；computed是计算属性，通过属性计算而得来的属性。watch需要在数据变化时执行异步或开销较大的操作时使用。computed 属性的结果会被缓存，除非依赖的响应式属性变化才会 ......
C#：多线程操作变量
在多线程环境下，变量的操作需要确保线程安全。C#提供了多种方式来实现线程安全的变量操作。 1. 使用lock语句 lock语句可以确保同一时间只有一个线程可以访问被锁定的代码块。以下是使用lock语句的示例： private static readonly object _lock = new ob ......
记录优化vue项目首屏加载慢的过程
##一 背景 当项目部署在外网时，前端首屏加载的平均时间是10S，通过开发者工具查看加载的包，例如chunk-libs.xxx.js的有2.9MB，因为包太大导致加载慢，严重影响了用户体验。 所以解决思路就有了两个： 能不能把包变小，下载就会快一些？ 有一些js、css不经常变化的文件能不能通过浏览 ......
[CSS]浅记录两种弹窗属性
自用笔记。考虑到不同页面的需求不同，弹窗的属性可能不同。 常规弹窗，采用fixed居中样式： .pup_f position fixed top 0px width 1080px // 页面宽度 height 1920px // 页面高度 background-color rgba(0, 0, 0, ......
分享一些大屏可视化也许有用的css技巧
分享一些大屏可视化也许有用的css技巧 - 掘金 (juejin.cn) 可视化大屏基本就是数据可视化，主题多为科技感为主。下面分享一些也许对你有用的css效果，都是比较简单的，如果后面有别的还会更新。 1、带蒙版的刻度镜头旋转效果 比如下面这种刻度 目的是实现镜头旋转时，上半部和下半部的刻度逐渐消 ......
VUE 大文件上传解决方案(500M以上)
以ASP.NET Core WebAPI 作后端 API ，用 Vue 构建前端页面，用 Axios 从前端访问后端 API ,包括文件的上传和下载。 准备文件上传的API #region 文件上传 可以带参数 [HttpPost("upload")] public JsonResult upl ......
TS+vite+Vue3打包报错
报错信息见上图 根据要求进行修改操作 由于vite将ts的配置文件tsconfig.json隐藏,所以在暴露出来的tsconfig.json中进行修改 根据依赖继承，能够找到现在的js版本为：ES2016 在暴露出来的tsconfig.json中增加： 再次打包后，接着代码出现不识别HTML和win ......
ansible debug 与变量
一、debug 模块 debug 调试模块： msg: 打印自定义消息 var: 要调试的变量名，与msg 选项互斥，只能用一个； verbosity: 一个控制调试运行时的数字，如果设置为3； msg 的使用： - name: 变量引用 hosts: host tasks: - name: "命令 ......
几段纯 CSS 代码实现的 漂亮边框效果
半透明边框 border:10px solid hsla(0, 0%, 100%,.5); background-clip:padding-box; 缝边效果 outline: 1px white dashed; outline-offset:-10px; border-radius:4%; bac ......
vue全家桶进阶之路18：Vue CLI脚手架
一切框架都是为了将开发变得简单、快捷、易操作，Vue CLI脚手架也不例外，它出自vue官方，脚手架的用意就是让开发变得像搭建房子那样标准而又有规划，它集成了很多常用的模块，更像是一个工具箱(插件集合)，很多常用的配置文件或者文件夹也直接就有了，例如：webpack。 在搭建之前我们需要确认我们有没 ......
vue3中watch的写法大合集。
VUE2的watch是一个属性写法是 watch:{ data1(newVal,oldVal){ 同步/异步操作 } } VUE3的watch则是一个函数，写法是 注意数据必须是响应式的 let num = ref(0) //watch(要监听的响应式数据,(新值，旧值)=>{更新时的回调}) wa ......
问题1：CSS布局方式有哪些？
CSS常见的布局方式包括弹性布局、固定布局、流体布局、混合布局、绝对定位布局等。 1.弹性布局：总体宽度及其中所有栏的值都以单位编写。这应使布局能够使用浏览器的指定基本字体大小缩放。 栏宽度将变得更宽, 能以任何大小显示更舒适、更可读的行长度。 2.固定布局：总体宽度及其中所有栏的值都以像素单位编写 ......
vue全家桶进阶之路8：Axios的安装与HTTP请求实战
Axios是一个基于Promise的HTTP客户端，用于在浏览器和Node.js中发送HTTP请求。它可以使用在Vue中发送请求以及与后端API进行交互。 在Vue中使用Axios可以通过以下步骤： 安装Axios 可以通过npm或yarn来安装Axios：npm install axios yar ......
第二篇 javascript 标示符、变量、语句、操作符
by caix in 深圳 1、标识符及变量 标识符 1、所谓标识符，就是变量、函数、属性的名字，或者函数的参数。 标识符申明规则: 1、第一个字符必须是一个字母、下划线 _ 、或者一个美元符号 $; 2、其他字符可以是字符串、下划线美元符或者数字； 3、区分大小写 变量 变量是存储数据的容器 Ja ......