大小 模板vue
如何在 vue3 中使用 jsx/tsx?
我们都知道,通常情况下我们使用 vue 大多都是用的 SFC(Signle File Component)单文件组件模式,即一个组件就是一个文件,但其实 Vue 也是支持使用 JSX 来编写组件的。这里不讨论 SFC 和 JSX 的好坏,这个仁者见仁智者见智。本篇文章旨在带领大家快速了解和使用 Vu ......
【Vue2.x源码系列06】计算属性computed原理
本章目标：计算属性是如何实现的？计算属性缓存原理以及洋葱模型的应用？在初始化Vue实例时，我们会给每个计算属性都创建一个对应watcher，我们称之为计算属性watcher ......
【PostageSQL】关于表的元数据信息比如行数、表空间大小、表索引访问次数、最近分析时间等信息收集
1 前言 最近看阿里云的RDS数据库的数据分析，发现人家统计信息很快，于是很好奇人家怎么收集的，其实就是调的PGSQL的语句来收集的，我们这节就来看看这些数据怎么来的哈。如下图RDS的收集信息： 2 数据收集 函数表 函数名返回类型描述 pg_size_pretty(bigint|numeric) ......
uniapp系列-超详细教你在uni-app+vue3里通过web-view组件传递信息打开H5页面写入localstorage并解决兼容性
web-view是什么 web-view 是一个 web 浏览器组件，可以用来承载网页的容器，会自动铺满整个页面（nvue 使用需要手动指定宽高）。 点击这里直达官网文档 点击这里下载我的代码demo 本文最下面还有一些==常见或者奇怪问题解决方案==哦~ 为什么使用这种方式搞页面？有什么好处呢？ ......
Android版本：如何更改复选框的大小
Android版本：如何更改复选框的大小？ 安卓android 复选框checkbox我想提出的CheckBox有点小/大了，我该怎么办呢？可以通过scaleX = "" 和scaleY=""属性来设置 <CheckBox android:scaleX="0.6" android:scaleY="0 ......
Vue(一）
1.Vue核心 1.1.介绍 1.1.1.官网 Vue中文官网：https://cn.vuejs.org 1.1.2.简介 Vue是一套用于构建用户界面的渐进式JavaScript框架。 构建用户界面：将一堆杂乱的数据转为简单易懂可视化的界面 渐进式：vue可以自底向上逐层的应用（从一个轻量小巧的核 ......
Vue引入腾讯地图
在public目录下的index.html文件中加入以下代码 //引入腾讯地图服务 <script charset="utf-8" src="http://map.qq.com/api/js?v=2.exp&key= 腾讯地图-控制台-添加应用生成的key "></script> //引入腾讯地图的 ......
vue3+vite+ts搭建一个基于cesium的gis系统
使用 NPM: bash $ npm create vite@latest 使用 Yarn: bash $ yarn create vite 使用 PNPM: bash $ pnpm create vite附加的命令行选项# npm 6.x npm create vite@latest my-vue ......
Vue生命周期详解
Vue生命周期 new Vue() new 了一个 Vue 的实例对象，此时就会进入组件的创建过程。 Init Events & Lifecycle 初始化组件的事件和生命周期函数 beforeCreate 组件创建之后遇到的第一个生命周期函数，这个阶段 data 和 methods 以及 dom ......
客服系统源码聊天界面，vue elementui中v-html渲染的内容，增加大图预览功能
我在开发聊天界面的过程中，聊天内容部分是使用v-html渲染出来的，能够展示html内容 但是加载的图片是不能点击放大查看的，现在增加点击放大预览功能 首先html部分是下面这样的，也就是下面要增加一个隐藏的el-image <div v-html="row.content" @click="htm ......
vue全家桶进阶之路38：Vue3父件传值给子件
在Vue3中，可以通过props将父组件的数据传递给子组件。具体步骤如下： 在父组件中定义要传递给子组件的数据，可以是data属性中的数据或者是计算属性computed中的数据。 在子组件中通过props属性声明接收父组件传递的数据。 在子组件中使用接收到的数据。 下面是一个示例： <templat ......
vue3学习之BootstrapVueNext
创建一个 Vue 应用 vue3快速上手 npm get registry #设置淘宝镜像 npm config set registry http://registry.npm.taobao.org #创建一个 Vue 应用 npm init vue@latest ✔ Project name: ......
vue全家桶进阶之路37：Vue3 状态管理
Vue3 的状态管理主要是通过 Vuex 4 来实现。Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式，它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。 在Vue3的状态管理中，以下是各个属性的作用： state：存储应用程序中的状态数据。它 ......
【Vue】Vue路由总结
由vue-router模块控制，需要额外安装依赖。参考官网 npm install vue-router --save 组成 router-link 路由跳转，类似a标签，路由跳转作用 <router-link to="" /> router-view 路由视图，用于其他组件在该视图位置显示。 <r ......
vue2源码-八、依赖收集的过程
依赖收集的过程 前言 使用真实节点替换原始节点，主要涉及以下步骤： 1.新老节点的更新方案。 2.虚拟节点与真实节点映射。 3.实现新老节点的替换。 依赖收集 已经完成了Vue的两大核心部分：响应式数据和数据渲染，即完成了整个Vue的初始化流程： 当new Vue()时，执行_init初始化，通过m ......
vue全家桶进阶之路36：Vue3 组件内部路由守卫
在 Vue Router 中，可以为路由和路由组件注册全局的路由守卫，也可以在组件内部注册路由守卫。 组件内部的路由守卫有以下几种： beforeRouteEnter：在路由进入组件前被调用，但是在组件实例化之前被调用，因此在该守卫中无法访问组件实例的 this。 beforeRouteUpdate ......
Vue3 setup中两个注意点
视频 6.setup的两个注意点 setup执行的时机 在beforeCreate之前执行一次，this是undefined。 setup的参数 props：值为对象，包含：组件外部传递过来，且组件内部声明接收了的属性。 context：上下文对象 attrs: 值为对象，包含：组件外部传递过来，但 ......
ie11 兼容 vue3思路mark
众所周知，vue3因为用了Proxy来实现响应式，而Proxy是es6的特性，这个特性是无法shim的。 如果用本身的js写一个es6的js的虚拟机呢？有点像c语言的自举了哈，只要写出一个汇编的c语言编译器，后面就可以脱离汇编，用c本身来实现更多的功能。 当然速度肯定没办法保证了，跑肯定是可以跑的。 ......
Vue3 reactive对比ref
视频 5.reactive对比ref 从定义数据角度对比： ref用来定义：基本类型数据。 reactive用来定义：对象（或数组）类型数据。 备注：ref也可以用来定义对象（或数组）类型数据, 它内部会自动通过reactive转为代理对象。 从原理角度对比： ref通过Object.defineP ......
Vue项目打包后放到SpringBoot项目里注意点
 ![](https://img2023.cnblogs.com/blog/3161121/202304/3161... ......
Vue3 vue3响应式原理_Proxy&Reflect
Proxy视频 Reflect视频 Vue3.0的响应式 实现原理: 通过Proxy（代理）: 拦截对象中任意属性的变化, 包括：属性值的读写、属性的添加、属性的删除等。 通过Reflect（反射）: 对源对象的属性进行操作。 MDN文档中描述的Proxy与Reflect： Proxy：https: ......
vue3 + TS：找不到模块“@/views/xxx.vue”或其相应的类型声明，ts语法报错
今天在项目开发中遇到一个 vue3 + Ts 的一个问题，项目运行没问题，但是就是代码就是报ts语法错误，如下： 原因：因为我们使用的是 ts 的语法，项目只识别 ts 后缀的文件，无法识别 .vue 文件，所以引入的时候会报错； tips：这里只是 ts 语法警告报错，实际并不影响我们项目的运行！ ......
vue
vue vue使用 端口号 静态是在static里面 index。html不能改变 id = app是绑定的 一对一绑定 webpack学习 静态模块打包器 到处暴露export，暴露了HelloWorld 有暴露就有，导入import 安装webpack 使用webpack 建立一个项目 暴露一个 ......
Vue 登录login post请求 security UserDetailsService 获取参数为""
背景 原请求将数据放到params中，导致数据拼接在请求地址后面，具有高级安全隐患。 请求方法: axios.request({ url: '/login', method: 'post', params: { username: '****', password: '****' } }) 出现的问 ......
Vue3+Ts 组合API调用子组件方法
1、子组建定义方法，并对外暴露 <script setup lang="ts"> import {computed, reactive, ref,defineExpose} from "vue"; /** * 定义方法 */ const initData = () => { console.info ......
Vue3移动端适配解决方案
导读： 使用vw和vh解决适配问题 vw：view width屏幕宽度，1vw等于屏幕宽度的百分之一 vh：view height屏幕高度，1vh等于屏幕高度的百分之一 使用插件postcss-px-to-viewport可以自动将px转换为vw/vh 安装 npm i postcss-px-to- ......
【Vue2.x源码系列06】计算属性computed原理
本章目标：计算属性是如何实现的？计算属性缓存原理以及洋葱模型的应用？在初始化Vue实例时，我们会给每个计算属性都创建一个对应watcher，我们称之为计算属性watcher ......
客服系统vue源码聊天界面，ajax上传图片功能实现
在线客服系统的聊天界面上，有上传图片按钮功能，使用js实现ajax上传图片功能 html部分，有一个点击事件 <div class="iconExtendBtn" @click="uploadImg"> <div class="elIcon el-icon-picture"></div> <div> ......
vue2使用最新版nanoid，运行报错
项目需要nanoid生成主键。 vue版本：2.6.14 npm i nanoid后，npm run serve报错： Error [ERR_REQUIRE_ESM]: require() of ES Module C:\projects\frontend\vue-test\node_modules ......
vue2 xlsx结合file-saver实现JSON导出excel 支持导出多sheet
先安装插件 npm install xlsx -s npm install file-saver -s 在本地封装导出方法，支持// 文件名：Export2MultipleSheetExcel//支持导出多个或者单个sheet import { saveAs } from "file-saver"; ......