前端 仓库nexus vue

Vue核心 el与data的两种写法

1.5. el 与 data 的两种写法el有2种写法a创建Vue实例对象的时候配置el属性b先创建Vue实例,随后再通过vm.$mount('#root')指定el的值data有2种写法a对象式:data: { }b函数式:data() { return { } }如何选择:目前哪种写法都可以,以 ......
写法 核心 data Vue

Vue核心 Vue简介 初识

1.1. Vue 简介 1.1.1. 官网● 英文官网● 中文官网 1.1.2. 介绍与描述●Vue 是一套用来动态构建用户界面的渐进式JavaScript框架○构建用户界面:把数据通过某种办法变成用户界面○渐进式:Vue可以自底向上逐层的应用,简单应用只需要一个轻量小巧的核心库,复杂应用可以引入各 ......
Vue 核心 简介

仓库管理、dockerfile

Docker仓库管理 ​ 仓库(Repository)是集中存放镜像的地方。 Docker Dockerfile 什么是Dockerfile? ​ Dockerfile 是一个用来构建镜像的文本文件,文本内容包含了一条条构建镜像所需的指令和说明。 使用Dockerfile定制镜像 1、下面以定制一个 ......
dockerfile 仓库

自定义 v-model 解决 Vue prop 只读属性,不可修改的问题

所有的 props 都遵循着单向绑定原则,props 因父组件的更新而变化,自然地将新的状态向下流往子组件,而不会逆向传递。这避免了子组件意外修改父组件的状态的情况,不然应用的数据流将很容易变得混乱而难以理解。 使用 emits 自定义事件以参数方式在父组件更新; 使用 emits 自定义 v-mo ......
属性 v-model 问题 model prop

Vue3的fetch和Axios

Vue3的fetch和Axios都是用于发送HTTP请求的JavaScript库,但是它们之间有以下几个区别:语法不同:fetch是浏览器原生的API,使用起来比较简单,而Axios是一个第三方库,需要通过npm安装后引入才能使用。功能不同:Axios提供了丰富的API来处理HTTP请求和响应,包括 ......
Axios fetch Vue3 Vue

创建镜像发布到镜像仓库【不依赖docker环境】

image 工具背景 如今,docker镜像常用于工具的分发,demo的演示,第一步就是得创建docker镜像。一般入门都会安装docker,然后用dockerFile来创建镜像,除此以外你还想过有更高效的方式吗? image Google开发的jib不依赖docker环境也能创建docker或者O ......
镜像 仓库 环境 docker

前端设计模式——计算属性模式

计算属性模式(Computed Property Pattern):在JavaScript中,可以使用Object.defineProperty()方法来实现计算属性模式,通过get和set方法来计算属性值。 计算属性模式用于将对象的某些属性值与其他属性值相关联。该模式常用于Vue.js等框架中。 ......
模式 设计模式 前端 属性

什么是前端开发领域中的 time to first byte 指标

在前端开发领域中,time to first byte(TTFB)指标是指浏览器发出请求后,服务器第一次返回数据所花费的时间,即从请求发送到收到第一个字节的时间。这个时间包括了浏览器发出请求到服务器接收到请求、处理请求并返回响应的时间。 TTFB 是一个重要的性能指标,因为它直接影响到用户的体验。较 ......
前端 指标 领域 first time

前端获取视频缩略图方式

代码示例: /** * 获取缩略图 * @param url 视频地址 * @param currentTime 缩略图取第几秒的图片 * @param width 截取的图片宽 * @param height 截取的图片高 * @returns {Promise<unknown>} */ expo ......
前端 方式 视频

前端常用的终端命令

终端主要的目的是可以让我们在文件系统中进行四处浏览和打开/运行某些东西,只是在 windows 上我们之前都是用 GUI 界面进行操作的,现在是在终端中使用 shell 命令进行操作而已。 ......
前端 终端 命令 常用

jenkins学习笔记之十七:使用插件及maven上传制品到nexus

一、docker安装nexus wget https://mirrors.aliyun.com/docker-ce/linux/centos/docker-ce.repo yum clean all && yum makecache fast um install docker systemctl ......
插件 jenkins 制品 笔记 maven

Vue2和Vue3之响应式原理详解

1 响应式原理 1.1 简介 在讲解之前,我们先了解一下数据响应式是什么? 所谓数据响应式就是建立响应式数据与依赖(调用了响应式数据的操作)之间的关系,当响应式数据发生变化时,可以通知那些使用了这些响应式数据的依赖操作进行相关更新操作,可以是DOM更新,也可以是执行一些回调函数。 1.2 vue2和 ......
Vue 原理 Vue2 Vue3

vue3基础练习

slot就是把标签传递进组件 实现同一个组件有不同的表现形式 同样因为组件就是自己制造的特殊标签,所以这儿也可以直接把组件传递到slot中 slot组件中,作用域的问题 传递进去的东西会替换掉slot,但是里面用的属性还是调用者的,也就是父组件中的{{}}变量直接调用父组件中data内容。 slot ......
基础 vue3 vue

前端工具库

Axios Lodash underscore Day.js ......
前端 工具

初识Vue3

vue3.0 一、创建Vue3.0工程 1.使用 vue-cli 创建 官方文档:https://cli.vuejs.org/zh/guide/creating-a-project.html#vue-create ## 查看@vue/cli版本,确保@vue/cli版本在4.5.0以上 vue -- ......
Vue3 Vue

Vue2学习笔记

VUE官网: https://cn.vuejs.org/ 参考教程: https://v2.cn.vuejs.org/v2/guide 快速入门 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Quick Vue Example ......
笔记 Vue2 Vue

vue状态管理

Vuex 基本使用 store/index.js import { createStore } from "vuex"; const store = createStore({ state: () => ({ counter:0 }) }) export default store App.vue ......
状态 vue

Vue路由

路由介绍 映射表,决定数据的流向 页面不刷新的方式 hash,监听hashchange事件 histroy模式:六种模式 pushState replaceState popState go forward back vue-router 基本使用 安装vue-router 创建路由对象 histo ......
路由 Vue

Vue基础

1. 声明式和命令式编程 2. MVVM模型 view--ViewModel(事件监听、数据绑定)--Model 3. options data属性: vue2中可以是一个对象,推荐函数 vue3中必须是一个函数,否则会报错 methods属性 不能是箭头函数,因为this指向window,不能获取 ......
基础 Vue

vue-axios

Axios 常用请求方式 get post delete put patch head request all: 发送多个请求,返回一个数组 axios.all([]) 常用配置选项 url method baseURL: 根路径 axios.default.baseURL = 'https://x ......
vue-axios axios vue

vue-element-template实现顶部菜单栏

一、框架侧边栏改为顶部导航栏 1、复制src/layout/componets/Sidebar所有文件至同级目录,改名为Headbar 2、src/layout/components/index.js中声明Headbar export { default as Headbar } from './H ......

Vue模板

<script src="/js/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.7.14/dist/vue.js"></script> <script type="text/javascript"> new ......
模板 Vue

万字血书Vue—Vuex

Vuex概述 组件之间共享数据的方式(小范围) 全局事件总线 Vuex是什么? 专门在Vue中实现集中式状态(数据)管理的一个Vue插件,可以方便的实现组件之间的数据共享。 使用Vuex统一管理状态的好处 能够在vuex中集中管理共享的数据,易于开发和后期维护 能够高效地实现组件之间的数据共享,提高 ......
血书 Vuex Vue

前端用户图像传递给后端数据库

在业务中,我们将图片上传到服务器之后,需要将图片保存地址返回给前端和保存在数据库中,那么怎么获得这个地址呢? 图片上传到哪里了??? 上传到什么服务器??? 前端上传 后端获取URL地址,保存数据库 数据库查询,返回URL地址前端,显示 ......
前端 图像 数据库 数据 用户

vue 代码规范 之 husky

#!/bin/sh . "$(dirname "$0")/_/husky.sh" npx eslint ./src --ext .js,.vue npx husky add .husky/pre-commit "npm run lint" ......
代码 husky vue

前端安全性

1.XSS(Cross-site Scripting 跨站脚本)攻击 方式:通过获取用户的Cookie、SessionId等敏感信息,影响网站及用户数据信息安全 XSS攻击要素: 1)攻击者提交恶意代码 2)浏览器执行恶意代码 防御方式: 1.增加攻击难度,降低攻击后果 2.增加验证码功能,防止冒充 ......
前端 安全性

ant-design-vue循环生成多个独立的form表单

前言 后台需要的参数格式如下: info=[{name:'',cardId:'',phone:''},{name:'',cardId:'',phone:''},{name:'',cardId:'',phone:''}] 由于后台参数的特殊性,每一行内容组成一个对象,如果这些对象都放到同一个form表 ......
表单 ant-design-vue 多个 design form

Vue——initState【十】

前言 前面我们简单的了解了 vue 初始化时的一些大概的流程,这里我们详细的了解下具体的内容; 内容 这一块主要围绕init.ts中的initState进行剖析,初始化生命周期之后紧接着。 initState initState的方法位于scr/core/instance/state.ts中; co ......
initState Vue

Vue介绍与生命周期详解

一、Vue简介 Vue是一款轻量级、高性能的JavaScript框架,用于构建用户界面,它的核心是数据双向绑定和组件化。Vue的设计灵感来源于AngularJS和React,但它更加易于上手和使用。 Vue的主要特点包括: MVVM模式:Vue采用了MVVM模式,将视图(View)、数据模型(Mod ......
周期 生命 Vue

初识vue3-setup语法糖,ref和reactive语法,computde计算属性,watch开启监听

vue3和vue2的区别 1,vue3首次渲染更快(Vue3在编译和渲染性能上有了很大的提升,主要是因为使用了Proxy代理和优化算法,使得组件可以更快的渲染) 2,diff算法更快 3,内存占用体积变得更小 4,打包体积变得更小 5,更好的ts支持(这里不是因为vue3是ts写的,所以更加支持ts ......
语法 vue3-setup reactive computde 属性