布局vue web

Vue中获取method方法return返回值--常用于请求成功后回调

mounted: () { this.getList('', (data) => { console.log(data); }) } methods: { getList (condition) { get_list({...condition}).then(res => { if (res.dat ......
方法 method return Vue

Vue2模版编译(AST、Optimize 、Render)

在Vue $mount过程中,我们需要把模版编译成render函数,整体实现可以分为三部分: parse、optimize、codegen。 ......
模版 Optimize Render Vue2 Vue

如何给vue的href添加拼接参数

原来一直使用angular,而vue的用法和angualr相似,故我默认以为vue的href添加拼接参数的写法为: <a href="/list/editor?name={{item.title}}">链接</a> 然测试发现这是不可行的,需要用以下方法: <a :href="'/list/edit ......
参数 href vue

3.26web和android端地铁查询开发学习总结

web端的思想在前面已经写了,Android端的思想跟web端差不多少,其中不一样的就是连接MySQL数据库,其要求的jar包是5版本左右的,而且还涉及到线程的问题,在连接MySQL的时候要另外启动一个线程进行连接,主要思想上没啥改变,就是每次每种查询要加一个button并且对应Onclick事件, ......
地铁 android 3.26 web 26

vue 组件通信

1. 子组件间通信(defineEmits + defineProps) 1.1 实现效果 在一个子组件的输入框中输入数据, 在另一个子组件上显示. 如下图: 1.2 defineEmits 和 defineProps 的 TS 使用 1.2.1 defineEmits 的 TS 使用 export ......
组件 vue

vue3 + vite 调试时断点位置错误

vite-plugin-vue-setup-extend(版本0.4.0) 插件的问题,删掉就好了。 该插件用于解决script setup语法糖下,不方便直接指定name名称的问题。 在 vite/plugins/index.js 文件中 注释 export default function cr ......
断点 错误 位置 vue3 vite

3.26全部完成android和web端的地铁查询系统

web端的思想在前面已经写了,Android端的思想 跟web端差不多少,其中不一样的就是连接MySQL 数据库,其要求的jar包是5版本左右的,而且还涉及 到线程的问题,在连接MySQL的时候要另外启动一个 线程进行连接,主要思想上没啥改变,就是每次每种 查询要加一个button并且对应Oncli ......
查询系统 地铁 端的 android 系统

vue全家桶进阶之路6:第一个Vue程序

1、创建一个文件夹用于下载引入Vue D:\BaiduSyncdisk\vue1 2、按照最新版本的Vue npm install vue ......
全家 程序 vue Vue

百度2020校招Web前端工程师笔试卷(第二批)(20~23)

21. <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <style> .checkgroup .item{ height: 42px; line-height: 42px; padding: 0 10px; margin: 10px 0; ......
前端 笔试 工程师 工程 2020

Vue核心 MVVM模型 数据代理

1.6. MVVM 模型 MVVM模型●M:模型 Model,data中的数据●V:视图 View,模板代码●VM:视图模型 ViewModel,Vue实例观察发现●data中所有的属性,最后都出现在了vm身上●vm身上所有的属性 及Vue原型身上所有的属性,在 Vue模板中都可以直接使用 <!DO ......
模型 核心 数据 MVVM Vue

Vue核心 模板语法 数据绑定

1.3. 模板语法Vue模板语法包括两大类1插值语法功能:用于解析标签体内容写法:{{xxx}},xxx 是 js 表达式,可以直接读取到 data 中的所有区域2指令语法功能:用于解析标签(包括:标签属性、标签体内容、绑定事件…)举例:<a v-bind:href="xxx">或简写为<a :hr ......
语法 核心 模板 数据 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 核心 简介

《渗透测试》WEB攻防-通用漏洞&SQL注入&MYSQL跨库&ACCESS偏移 2022 Day24

1 前置知识: -SQL注入漏洞产生原理分析 攻击者利用服务器中的web应用程序将带有恶意的SQL语句作为Web表单中的参数提交 到服务器,服务器所接受的程序又将带有恶意的SQL语句作为SQL语句中的一个参数执行, 这样根据程序返回的结果攻击者可获得想知道的数据 -SQL注入漏洞危害利用分析 漏洞产 ......
amp 漏洞 ACCESS MYSQL 2022

自定义 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

跟着chatgpt学web安全

跟着chatgpt学web ctf中web学习路线 HTTP协议:首先需要了解HTTP协议的基本知识,包括请求和响应的结构,HTTP方法和状态码等。 Web开发基础知识:熟悉常见的Web开发技术和框架,如HTML、CSS、JavaScript、PHP、Python等,以及常见的数据库技术。 Web应 ......
跟着 chatgpt web

什么是 Web 应用程序的 synthetic monitor

Web 应用程序的 synthetic monitor 是一种监测工具,用于模拟用户与 Web 应用程序交互的过程,并监测系统的响应时间和性能表现。该工具使用自动化脚本来模拟用户行为,例如页面导航、表单提交、搜索查询等,并监测应用程序在每个步骤中的响应时间、页面加载时间、交互功能的可用性等指标。通过 ......
应用程序 synthetic monitor 程序 Web

什么是 Web 应用里加载 google font 带来的 FOIT 和 FOUT 问题?

在 Web 应用中,当你使用 Google Fonts 或其他字体资源时,可以通过添加 &display=swap 参数来实现 FOIT(Flash of Invisible Text)和 FOUT(Flash of Unstyled Text)的优化。 当 Web 应用在加载 Google 字体时 ......
google 问题 FOIT FOUT font

关于 Web 应用的 Above-the-Fold Loading 加载机制

Above-the-Fold Loading 是一种网页加载技术,可以让网页的上半部分尽快地显示在屏幕上,让用户能够更快地看到网页的内容,提高用户体验。具体来说,Above-the-Fold Loading 会优先加载页面上部分所需的 HTML、CSS、JS等资源,而不是等到所有资源都加载完毕后再一 ......
Above-the-Fold 机制 Loading Above Fold

关于 Web 应用的内联 css 和 scss 文件里的 var 关键字用法

为什么网站性能调优准则里都强调要 Use inline fonts and CSS instead of loading them asynchronously? 网站性能优化的一个重要目标是尽可能地缩短页面加载时间,使用户可以更快地访问您的网站。加载字体和CSS样式表是构建页面的重要组成部分,但是 ......
关键字 关键 文件 scss Web

Vue2和Vue3之响应式原理详解

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

vue3基础练习

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

初识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 ......