three vue js
ue全家桶进阶之路30：Vue定义组件
要定义 Vue 3 组件，你可以使用 Vue 3 提供的 defineComponent 函数。 例如，以下是一个简单的 Vue 3 组件定义： import { defineComponent } from 'vue'; export default defineComponent({ name: ......
使用js对tensorspace/three.js/webgl进行截图
使用js对tensorspace/three.js/webgl进行截图 问题分析 场景：在右侧，是 tensorspace库 使用three.js 调用webgl 对模型进行渲染的画面。我需要使用js对右侧画面进行截图，并保存至本地用于分析。 问题：对webgl进行截图需要进行一些特别的操作，使用h ......
vue-router 实现原理
一、vue-router是什么 通过改变URL,在不重新请求页面的情况下，更新页面视图 二、vue-router两种模式 更新视图但不请求页面，是前端路由原理的核心之一。目前在浏览器中，这一功能的实现主要有两种方式： hash 模式 history 模式 ......
leaflet.openPopup() 方法传入参数是个模板字符串，如何将其改为使用vue的模板实现，可以支持数据双向绑定
注：这个问题是我使用cursor得到的回答。 问：leaflet.openPopup() 方法传入参数是个模板字符串，如何将其改为使用vue的模板实现，可以支持数据双向绑定 为了将 this.map.openPopup() 方法中的字符串模板替换为支持双向数据绑定的 Vue 模板，您可以使用 Vue ......
【vue3-element-admin】Husky + Lint-staged + Commitlint + Commitizen + cz-git 配置 Git 提交规范
整合 Husky + Lint-staged + Commitlint + Commitizen + cz-git 并配置的 pre-commit 和 commit-msg 两个钩子分别实现 Git 提交前代码检测和 Git 提交信息规范。 ......
Vue3中 如何使用ref标签，对组件进行操作
在Vue2中 一般用 this.$ref.xxxx 进行获取组件对象 Vue3中就不使用这个方法了 例如: <el-upload class="upload-demo" action="" :http-request="handleUpload" :on-change="handleChange" ......
关于node.js安装
总结：傻瓜式安装就行了，按照官方给的默认配置。 之前一直认为像网上的教程一样，将目录放到D盘比较好，也修改了环境变量。 在实际使用过程中发现许多问题，特别是当加入一些新配置或者全局安装的时候可能出现问题。 比如加入git cz新配置时，发现使用VS Code自带的git提交会报错。 结果排查出来是在 ......
vue3中使用ref语法糖
自从引入组合式 API 的概念以来，一个主要的未解决的问题就是 ref 和响应式对象到底用哪个。 响应式对象存在解构丢失响应性的问题，而 ref 需要到处使用 .value 则感觉很繁琐，并且在没有类型系统的帮助时很容易漏掉 .value 写法优化 以上是官方原话。大概就是新的语法糖 可以让我们更方 ......
【js】时间戳转时间 1680338700 =》2023-04-01 16:45:00
1 transformTimestamp (timestamp) { 2 let date = new Date(parseInt(timestamp) * 1000) 3 let Year = date.getFullYear() 4 let Moth = (date.getMonth() + 1 ......
Vue3 初识setup
视频 二、常用 Composition API 官方文档: https://v3.cn.vuejs.org/guide/composition-api-introduction.html 1.拉开序幕的setup 理解：Vue3.0中一个新的配置项，值为一个函数。 setup是所有Compositi ......
python+playwright 学习-52 iframe 定位与操作元素，监听事件，执行JS脚本总结
前言 本篇全面总结关于iframe 的定位，iframe上元素的操作（输入框，点击等），iframe 上的事件监听 与iframe上执行JS脚本的总结。 iframe 对象的定位 定位iframe 对象，总的来说有四种方法 page.frame_locator(selector) 通过page对象直 ......
JS中Map、WeakMap和Object的区别
JavaScript中的Map、WeakMap和Object都是用于存储键值对的数据结构： 1. Map：Map是一种新的数据结构，它允许使用任何数据类型（包括对象和基本数据类型）作为键。Map的一些特性包括： - 保持键的插入顺序：当遍历Map时，键值对会按照插入顺序返回。- 键可以是任意类型：与 ......
【迭代器设计模式详解】C/Java/JS/Go/Python/TS不同语言实现
简介 迭代器模式（Iterator Pattern），是一种结构型设计模式。给数据对象构建一套按顺序访问集合对象元素的方式，而不需要知道数据对象的底层表示。 迭代器模式是与集合共存的，我们只要实现一个集合，就需要同时提供这个集合的迭代器，就像Java中的Collection，List、Set、Map ......
js报错：devtools failed to load source map : could no load content for
报错：DevTools failed to load source map: Could not load content for http://localhost:8000/css/bootstrap.min.css.map: HTTP error: status code 404, net::E ......
Vue3 vue-cli创建工程的工程结构分析
视频 不能用vue2的写法了 #components ##HelloWorld.vue <template> <div class="hello"> <h1>{{ msg }}</h1> <p> For a guide and recipes on how to configure / custom ......
安装vue-lic
vue-cli是Vue.js开发的标准工具。它简化了程序员基于webppack创建工程化的Vue项目的过程。引用自vue-cli官网上的一句话:程序员可以专注在撰写应用上,而不必花好几天去纠结\webpack配置的问题。 安装和使用 （1）确保电脑已经安装了node.js，如果不确定自己是否安装了n ......
vue中开启https
vue2.0中 项目工程根目录下，找到文件 vue.config.js。设置 module.exports.devServer.https: true 项目工程根目录下，找到文件 vue.config.js。设置 module.exports.devServer.https: true module ......
Vue3 vue-cli或vite创建工程
使用 vue-cli 创建工程视频 使用 vite 创建工程视频 一、创建Vue3.0工程 1.使用 vue-cli 创建 官方文档：https://cli.vuejs.org/zh/guide/creating-a-project.html#vue-create ## 查看@vue/cli版本，确 ......
vue3+vant创建移动端项目，实战项目常见采坑记录
前言： 产品背景介绍 我所做的这个项目，刚开始是没有移动端需求的，等PC端做完了上线使用了几个月后，突然有一天产品经理找到我说是要做一个在PC端添加一个快速注册入口，用手机微信扫二位码进入移动端注册页面，用户注册。 所以本次需求就是在PC端添加一个tool-tip气泡型弹出二维码，再开发一个移动端注 ......
vue中的动态写法
1. :class=" `${ isShow? 'box': '' }` " 2. <div : edit=' getEdit(item.id) ' getEdit(id) { return this[ 'edit' + id] } 3. this.edit1 = this['edit' + id] ......
CKEditor粘贴图片自动上传到服务器(JS版)
如何做到 ueditor批量上传word图片？ 1、前端引用代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.d ......
Vue中单选框或复选框中的label内容过长，超出范围
解决办法: 1、直接把字体调小 2、当需要的字体大小还是超出了范围时 在css中写（如果是复选框；单选框的class： el-radio__label） .el-checkbox__label { text-overflow: ellipsis; white-space: normal; line- ......
vite启动vue项目报错import { performance } from 'node:perf_hooks'
import { performance } from 'node:perf_hooks'^^^^^^ SyntaxError: Cannot use import statement outside a module 要求node版本要大于16 使用nvm 切换node版本 成功运行 ......
二、使用Vue3 + Vue CLI 实现系统前端模块的搭建
主要内容 前端模块的搭建：Vue CLI5 + Vue3 + Ant Design Vue3 完成手机号登录/注册功能 收获 学会纯前端项目的搭建 理解前后端分离架构 本地环境准备 vue cli安装: https://cli.vuejs.org/zh/guide/installation.html ......
文件名称使用vue前端设置utf-8乱码问题
文件名称使用vue前端设置utf-8乱码问题 1、下载入口 /** * @description 下载文件到前端 * @params response * @params filePath 文件存放的完整路径，以文件名结尾 *@params fileName * @return void */ pu ......
vue中el-checkbox全选、反选、多选
<template> <div> <el-checkbox v-model="checkAll" @change="handleCheckAllChange" :indeterminate="isIndeterminate" >全选</el-checkbox > <el-checkbox v-mod ......
vue input每次输入一个字符后自动失去焦点 问题
我在输入框输入的时候，每输入一次，输入框就自动失去焦点了。ps：实现的功能是，一个列表组件，每个对象中都有一个input输入框。 <div class="addTags" v-for="(item,index) in list" :key="item.title"> <input type="tex ......
【vue3-element-admin】ESLint+Prettier+Stylelint+EditorConfig 约束和统一前端代码规范
通过ESLint 检测 JS/TS 代码、Prettier 格式化代码、Stylelint 检测 CSS/SCSS 代码和配置 EditorConfig 来实现前端代码规范约束和统一。 ......
Vue中使用全局事件总线
使用第三方库mitt实现全局事件总线，其原理，和Vue2类似，在app.config.globalProperties上添加总线，然后在需要的组件中引入，调用其on/emit/off等方法实现绑定、派发和解绑等操作 1、下载安装 npm i mitt 2、在main.ts中配置 import { c ......