前端 终端 实战vue

Vue3 路由查询参数更新后,执行更新方法

import { ref, defineComponent, watch,getCurrentInstance } from "vue"; import { useRoute } from 'vue-router'; export default defineComponent({ setup() ......
路由 参数 方法 Vue3 Vue

Vue - 创建 Vue3 项目

Vue - 创建 Vue3 项目 需搭建项目 Vue3 + ts + sass 1. 创建项目 npm create vite@latest 2. 安装依赖 tyarn 3. 启动项目 yarn dev 4. 处理其他配置问题 1) 打开HelloWorld.vue页面,发现一些报红,报错 解决:找 ......
Vue 项目 Vue3

vue兄弟组件共享数据

1、vue2.x中,兄弟组件共享数据的方式 EventBus。 一、A组件import eventBus from "@/components/eventBus";export default { methods: { send() { eventBus.$emit('share', this.st ......
组件 兄弟 数据 vue

解决Vue中使用wangEditor富文本编辑器复制粘贴word文档携带内容样式文本问题

前言:本文记录作者在vue项目中使用到wangEditor富文本编辑器复制粘贴功能所遇到的bug,故此把自己所遇到的坑及问题详细的记录下来。如果觉得作者写的不错,希望得到您的点赞/收藏/支持,如果有不同意见,欢迎下方评论区留言。 一、自定义处理粘贴的文本内容1、配置 自定义处理粘贴的文本内容~~~如 ......
文本 编辑器 wangEditor 样式 文档

vue3 Suspense

在Vue.js 3中,Suspense 是一个用于处理异步组件的特殊组件,它允许你在等待异步组件加载时展示备用内容。这对于优化用户体验、处理懒加载组件或异步数据获取时非常有用。Suspense 的主要目标是简化异步操作的状态管理和展示。 下面是一个简单的例子,演示了如何在Vue.js 3中使用Sus ......
Suspense vue3 vue

vue3 KeepAlive

在Vue.js 3中,<keep-alive> 是一个抽象组件,用于保留其子组件状态,防止在切换组件时销毁它们。这对于在页面间切换时保留组件的状态或避免重复渲染特定组件非常有用。<keep-alive> 主要用于缓存组件,以提高性能和用户体验。 以下是一个简单的例子,演示了如何在Vue.js 3中使 ......
KeepAlive vue3 vue

vue3 Teleport

在Vue.js 3中,Teleport 是一种特殊的组件,用于在 DOM 树中的任何地方渲染其内容,而不受父组件的约束。这对于需要将组件的内容移动到 DOM 树的其他部分时非常有用,例如在模态框或弹出窗口中使用。 Teleport 提供了两个名为 teleport 和 teleport-to 的指令 ......
Teleport vue3 vue

终端产品研发过程中的常见缩略词

ODM: Original Design Manufacturer (原始设计制造商)PCBA: Printed Circuit Board Assembly (印刷电路板组装)COB: Chip on Board (板上芯片封装)MOB: Module on Board (模块板上封装)EMS:  ......
终端产品 终端 常见 过程 产品

vue项目中安装scss

1、安装node-sass、sass-loader 简化内容,具体版本等注意事项在下面。(node官网:GitHub - sass/node-sass: :rainbow: Node.js bindings to libsass) //默认安装最新版本 npm install node-sass - ......
项目 scss vue

界面控件DevExtreme图表和仪表(v23.1) - 新功能(Angular,React,Vue,jQuery)

本文将为大家总结下DevExtreme在v23.1版本中发布的一些与图表和仪表盘相关的功能。 DevExtreme拥有高性能的HTML5 / JavaScript小部件集合,使您可以利用现代Web开发堆栈(包括React,Angular,ASP.NET Core,jQuery,Knockout等)构 ......
图表 控件 新功能 DevExtreme 界面

支付宝 返回的form如何在前端打开

支付宝支付时返回了一段标签标签大概是 <form></form><script></script> 试了innerHtml怎么试都不能用,是那种直接把字符串输出到div里面去的而不是转为标签 那么应该怎么处理呢? document.write(this.payData.config) 一句搞定。。。 ......
前端 form

读书笔记 -- Junit 实战(3rd)Ch05、Ch06 测试质量

Ch05 软件测试原则 1. 系统测试 测试替身 或 模拟对象 可以模拟复杂的真实对象的行为。 模拟对象(mock object):可以出现在单元测试级别,其作用是替代系统中不可用的部分或合并到一个测试中不切实际的部分。 测试替身(test doubles):是模拟对象,可 以可控的方式模拟真实对象 ......
实战 质量 笔记 Junit Ch

前端学习-JavaScrip学习-js基础03

学习教程:黑马程序员视频链接 循环 案例-九九乘法表 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-s ......
前端 JavaScrip 基础 js

前端学习-JavaScrip学习-sort()函数

sort()函数默认按照字符串Unicode码排序 如果希望按照数字大小排序,需要传参 let arr = [2,4,5,6,22,9,10,111,2,1,32]; console.log(arr.sort(function(a,b) { return a - b; //升序 // return ......
前端 函数 JavaScrip sort

前端学习之html和css

前端 快速入门篇:首先给个title,就是页面标题,比如说这页的 博客后台 - 博客园 这种,第二就是我在它的页面身体里面的标题有h1——h6六种大小的标题,可以按需选择,这个是文字类,然后为了美观一点,可以放图片上去,然后图片也得有它的大小尺寸,包括文字标题也是对吧,所以就引入了css,,css就 ......
前端 html css

Vue防抖debounce

在搜索框中随着输入内容而更新显示内容或者需要请求接口等逻辑时,如果每一个字符变化都去更新则会浪费一些没有必要的请求,想要的结果是某一个时间内不要去更新,就是常用的防抖测略 Vue中防抖逻辑:在响应式的变量在包装一个响应式,新的响应式只有在一定时间到时才更新,具体如下 export function ......
debounce Vue

vue 使用elementui el-image 图片地址不变,图片不刷新问题

问题 :el-image图片地址不变,图片不刷新问题 原因 : 在 Web 开发中,浏览器会缓存已经加载的静态资源(比如图片、CSS、JS 文件),以提高页面加载速度,减轻服务器负担。 当图片的源路径不变时,浏览器会对这些图片进行缓存,如果图片内容更新了,但是浏览器还是使用缓存,这时候就需要 在图片 ......
图片 elementui el-image 地址 问题

Vite4+Typescript+Vue3+Pinia 从零搭建(2) - tsconfig配置

tsconfig配置 项目代码同步至码云 weiz-vue3-template 关于tsconfig的配置字段可查看其他文档,如 typeScript tsconfig配置详解 tsconfig.json 文件修改如下: { "compilerOptions": { "target": "ESNex ......
Typescript tsconfig Vite4 Pinia Vite

Vite4+Typescript+Vue3+Pinia 从零搭建(1) - 项目初始化

项目初始化 项目代码同步至码云 weiz-vue3-template 前提准备 1. node版本 Node.js版本 >= 12,如果有老项目需要旧版本的,推荐用 nvm 管理node版本。 PS C:\Users\Administrator> nvm --version 1.1.11 PS C: ......
Typescript 项目 Vite4 Pinia Vite

11 9 学习vue3

今天创建了vue项目,了解了vue项目的目录如下: vue的组件分为组合式api和选项式api ①创建了组件内容如下: <script setup> import {articleGetAllService,articleSearchService} from '@/api/article.js' ......
vue3 vue 11

记录--vue3 setup 中国省市区三级联动options最简洁写法,无需任何库

这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助 在写页面的时候,发现表单里面有一个省市区的 options 组件要写,因为表单很多地方都会用到这个地址选择,我便以为很简单嘛。 虽然很简单的一个功能,但是网络上能搜索到的教程大多都是需要配合 elementUI 等各种 UI 库的,但是我 ......
省市区 写法 省市 options setup

vue2 switch 将文字显示在按钮内部

el-element plus已经实现了该功能了,其实主要就是改样式。 效果图 样式修改 <el-switch v-model="value" active-color="#13ce66" active-text="在读" inactive-text="毕业" inactive-color="#ff ......
按钮 文字 switch vue2 vue

Go Web开发进阶项目实战-Go语言实战课程体系,企业项目开发经验与技巧

书接上回,上次我们搭建好了项目入口文件,同时配置了路由体系,接着就可以配置项目的模板了,这里我们采用Iris内置的模板引擎,事实上,采用模板引擎并不意味着前后端耦合,模板中的数据保持其独立性即可,也就是说模板的数据操作交互方式采用http接口请求的形式,Iris并不参与模板逻辑,只返回Json格式的 ......
实战 项目 项目开发 体系 语言

网页实战

最近一周给一个小公司设计一个产品展示网页,初步决定使用vue来做,页面大致布局就是分成几个div,顶部设置一个头部导航栏,点击或者悬停鼠标的时候可以弹出阴影框,在 阴影框里含有产品分类,点击顶部的产品展示或者阴影栏里的分类产品可以跳转,跳转后依然保留顶部的导航栏作为便捷跳转,左侧是另一个样式的导航栏 ......
实战 网页

vue3中使用qrcode生成二维码

安装 npm install --save qrcode.vue or yarn add qrcode.vue 组件中使用 <script setup lang="ts"> import { useUiSetStore } from '@store/modules/uiSettings' //导入二 ......
qrcode vue3 vue

vue 适配不同分辨率显示问题

新建 js 文件 rem.js class DevicePixelRatio { constructor() { // this.flag = false; } // 获取系统类型 _getSystem() { // let flag = false; var agent = navigator.u ......
分辨率 问题 vue

jQuery.js - 前端必备的Javascript库

作者:WangMin 格言:努力做好自己喜欢的每一件事 jQuery.js 是什么? jQuery是一个快速简洁、免费开源易用的JavaScript框架,倡导写更少的代码,做更多的事情 。它封装JavaScript常用的功能代码,提供了一种简便的JavaScript设计模式,以及我们开发中常用到的操 ......
前端 Javascript jQuery js

vue将前端的json文件上传到后台对应目录

前端方法代码: /** * * @param {*} fileName 文件名 * @param {*} data 要保存的json对象 * @returns */ saveJsonFileToLocal(fileName, data) { let file = new File([JSON.str ......
前端 后台 文件 目录 json

vue2打包部署问题

本地部署 const { defineConfig } = require('@vue/cli-service') module.exports = defineConfig({ transpileDependencies: true, // devServer: { // open: true, ......
问题 vue2 vue

vue路由跳转后页面样式错乱,刷新一下又好了的问题

跳转页面 后输入框过大 解决 <style scoped > 加上scoped 分析 大概率是因为 vue加载组件的时候,会把所有组件的css全部加载到一起,而这个时候 样式是全局的, vue会偷懒不再渲染当前页面的样式 首先想到的是利用 scoped来解决,在 vue中引入了 scoped这个概念 ......
路由 样式 页面 问题 vue