变量vue3 vue css

vue计算器

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>methods</title> <script src="js/vue.js"></script> </head> <body> <div id="app"> <input typ ......
计算器 vue

VUE分别写出 4种计算器

监听器计算机 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>watch</title> <script src="js/vue.js"></script> </head> <body> <div id="app"> <inpu ......
计算器 VUE

vue计算器的四种代码

1.使用表达式 使用v-if对表达式进行运算 <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>hhhh</title> <script type="text/javascript" src="js/vue.js"></scr ......
计算器 代码 vue

【vue】给 dom 添加拖拽功能

实现效果 实现步骤 新建一个 drag.js 注册拖拽指令 import Vue from 'vue'; //使用Vue.directive()定义一个全局指令 //1.参数一:指令的名称,定义时指令前面不需要写v- //2.参数二:是一个对象,该对象中有相关的操作函数 //3.在调用的时候必须写v ......
功能 vue dom

Vue项目安装插件

安装ElementUI npm install element-ui@2.15.3 安装Axios npm install axios ......
插件 项目 Vue

Shell 变量

和普通的高级语言比较:java\python\go之类的,有2个核心点要注意 字符串字面量的表示 操作符之间的空格问题 Shell 变量 定义变量时,变量名不加美元符号($),如: 语言的本质在于编译原理, 除了机器语言, 上层封装都取决于宿主怎么解释,token每种语言都不完全一样。 所以作为面向 ......
变量 Shell

VUE2.0 学习 第一组

本笔记主要参考菜鸟教程和官方文档编写。 1. 对于Vue2.0来说每个vue应用都需要实例化vue来实现。 var vm = new Vue({ // 选项 }) 2.首先,DOM是一种api,它可以动态地访问程序和脚本,更新其内容、结构和文档,我认为符合这类功能的都可以叫dom,其次,每一个DOM ......
VUE2 VUE

CSS选择器优先级(CSS三大特性:层叠性、继承性、优先级)

本博文介绍CSS三大特性之一:优先级。 1 规则 (1)若选择器相同,则执行层叠性(层叠性:给相同的选择器设置相同的样式,则“后来居上”,后面设置的样式会覆盖前面设置的样式); (2)若选择器不同,则有优先级。 2 选择器权重 常见的选择器权重如下表: 选择器 权重 继承或者*(通配符) 0,0,0 ......
优先级 继承性 CSS 特性 三大

第三十六篇 vue - 应用规模化 - 路由

客户端 vs 服务端路由 服务端路由指的是服务器根据用户访问的 URL 路径返回不同的响应结果。当我们在一个传统的服务端渲染的 web 应用中点击一个链接时,浏览器会从服务端获得全新的 HTML,然后重新加载整个页面。 然而,在单页面应用中,客户端的 JavaScript 可以拦截页面的跳转请求,动 ......
路由 规模 vue

第三十七篇 vue - 应用规模化 - 测试

为什么需要测试 自动化测试能够预防无意引入的 bug,并鼓励开发者将应用分解为可测试、可维护的函数、模块、类和组件。这能够帮助你和你的团队更快速、自信地构建复杂的 Vue 应用。与任何应用一样,新的 Vue 应用可能会以多种方式崩溃,因此,在发布前发现并解决这些问题就变得十分重要 测试的类型 当设计 ......
规模 vue

第三十三篇 vue - 应用规模化 - 工具链

项目脚手架 vite Vite 是一个轻量级的、速度极快的构建工具,对 Vue SFC 提供第一优先级支持。作者是尤雨溪,同时也是 Vue 的作者 要使用 Vite 来创建一个 Vue 项目,非常简单 npm init vue@latest 这个命令会安装和执行 create-vue,它是 Vue ......
规模 工具 vue

第三十五篇 vue - 应用规模化 - 状态管理 - Pinia

什么是状态管理 理论上来说,每一个 Vue 组件实例都已经在“管理”它自己的响应式状态了。我们以一个简单的计数器组件为例 <script> export default { // 状态 data() { return { count: 0 } }, // 动作 methods: { incremen ......
状态 规模 Pinia vue

第三十二篇 vue - 应用规模化 - 单文件组件 SFC

单文件组件 SFC Vue 的单文件组件 (即 *.vue 文件,英文 Single-File Component,简称 SFC) 是一种特殊的文件格式,使我们能够将一个 Vue 组件的模板、逻辑与样式封装在单个文件中 Vue 的单文件组件是网页开发中 HTML、CSS 和 JavaScript 三 ......
组件 规模 文件 vue SFC

第三十四篇 vue - 应用规模化 - 服务端渲染 - SSR

总览 什么是 SSR SSR - 服务端渲染 Vue.js 是一个用于构建客户端应用的框架。默认情况下,Vue 组件的职责是在浏览器中生成和操作 DOM Vue 也支持将组件在服务端直接渲染成 HTML 字符串,作为服务端响应返回给浏览器,最后在浏览器端将静态的 HTML“激活”(hydrate) ......
规模 vue SSR

你不得不了解的CSS数据类型

在我之前的开发中,CSS对于我来说,要用什么找什么,对CSS的了解并不算深入;在我刚开始深入学习CSS时,第一个遇到的就是CSS数据类型,我听说过JS、TS的数据类型,CSS怎么也有数据类型?但是随着我对CSS数据类型的了解,CSS的大门也在缓缓为我打开!!! 什么是CSS数据类型? 引用《CSS新 ......
类型 数据 CSS

文字下划线hover穿梭特效 - CSS

Code: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" conte ......
下划线 特效 文字 hover CSS

谷歌浏览器中使用vue调试工具

1、下载调试工具下载地址:Vue Devtools_6.1.4_chrome 2、解压下载的压缩文件: 3、打开chrome浏览器,进入chrome://extensions/ 将已经解压的文件拖入扩展程序中: 4、看到下面表示成功: 5、使用项目运行命令npm run serve,开始启动项目: ......
浏览器 工具 vue

Vue路由-Router

官网学习地址:https://router.vuejs.org/zh/guide/essentials/named-routes.html 以下介绍了:Router的使用;子路由;路由重定向;编程式导航 环境: 1、已安装VS Code,等插件 2、前端项目管理页面,已安装 cli-plugin-r ......
路由 Router Vue

CSS选择器和属性

CSS选择器 概念:选择器是选取旭设置样式的: 分类: 1.元素选择器 元素名称{color:red;} 2.id选择器 #id属性{color;red;} 3.类选择器 .class属性值{color:red;} <!DOCTYPE html> <html lang="en"> <heah> <m ......
属性 CSS

Vue环境安装

前言: 前端项目需要工程化管理,可以使用Vue脚手架工具简化项目创建过程;专注于代码,不用关心项目创建和配置细节。 一、Vue脚手架工具 官网:https://cli.vuejs.org/zh/ 用于快速生成 Vue 项目基础架构; 1、安装 vue-cli 在支持npm环境下,win端cmd命令: ......
环境 Vue

vue3 directive自定义指令

import store from '../store'// 新建jsexport default { install(app) { // 权限控制, 没有相关的权限, 则删除模块 app.directive('permission', { mounted(el, val) { if(el && ! ......
指令 directive vue3 vue

转maven安装和设置变量

一、下载 Maven 访问Maven的下载页面:http://maven.apache.org/download.html。 我是windows10系统,这里选择zip这个压缩包。 二、解压 maven 压缩包 解压下载的zip压缩包,最好是把这些jdk、maven、tomcat归类在一个文件夹,我 ......
变量 maven

第三十一篇 vue - 逻辑复用 - 插件

插件 插件 (Plugins) 是一种能为 Vue 添加全局功能的工具代码。下面是如何安装一个插件的示例 import { createApp } from 'vue' const app = createApp({}) app.use(myPlugin, { /* 可选的选项 */ }) 一个插件 ......
插件 逻辑 vue

第三十篇 vue - 逻辑复用 - 自定义指令

自定义指令 除了 Vue 内置的一系列指令 (比如 v-model 或 v-show) 之外,Vue 还允许你注册自定义的指令 (Custom Directives)。 我们已经介绍了两种在 Vue 中重用代码的方式:组件和组合式函数。组件是主要的构建模块,而组合式函数则侧重于有状态的逻辑。另一方面 ......
指令 逻辑 vue

第二十九篇 vue - 逻辑复用 - 组合式函数

什么是 组合式函数 在 Vue 应用的概念中,“组合式函数”(Composables) 是一个利用 Vue 的组合式 API 来封装和复用有状态逻辑的函数 当构建前端应用时,我们常常需要复用公共任务的逻辑。例如为了在不同地方格式化时间,我们可能会抽取一个可复用的日期格式化函数。这个函数封装了无状态的 ......
函数 逻辑 vue

CSS

盒子模型 margin:外边距,即边框和其它盒子的距离,两个盒子之间取最大的margin值 border:边框 padding:内边距,即内容和边框的距离 ......
CSS

selenium使用css selector和xpath的比较

selenium提供的定位方式(常用) 推荐的定位方式的优先级 优先级最高:ID 优先级其次:name 优先级再次:CSS selector 优先级再次:Xpath针对css selector和xpath的优先级做一个简单的说明在项目中我们可能用的最多的是css或者xpath,那么针对这两种,我们优 ......
selenium selector xpath css

ant-design-vue datePicker日期组件中文格式月份与星期显示英文

根据官网的写法,在app.vue文件引入国际化设置组件 <template> <a-config-provider :locale="locale"> <App /> </a-config-provider> </template> <script> import zhCN from 'ant-de ......

vue之表单处理

vue之表单处理(一) 实验介绍基本用法文本多行文本单选按钮复选框多个复选框选择框 实验介绍 在日常的开发中,表单随处都被使用到,如:登录,问题反馈功能等。对表单的数据收集和绑定也是很常规的工作。在一般开发中处理表单,需要通过操作 DOM 来实现,是一个相对繁琐且低效率的工作。然而在 Vue 项目中 ......
表单 vue

使用vue四种方法写一个计算器

第一种:使用computed计算属性 1.创建项目,引入vue <script type="text/javascript" src="js/vue.js" ></script> 2.实例化vue <div id="app"> </div><script> var vm = new Vue({ el ......
计算器 方法 vue