截图 部分vue3 vue
7.Vue3
8.Vue3 8.1.创建工程 8.1.1.使用vue-cli创建 这个创建方式与vue2的创建方式一致，只不过在选择版本的时候选择3即可 ## 查看@vue/cli版本，确保@vue/cli版本在4.5.0以上 vue --version ## 安装或者升级你的@vue/cli npm insta ......
Snipaste，一款简单强大的截图贴图利器
Windows 系统有自带的截图工具，但不方便， 无论是截图方式，还是标注，也十分的简陋和粗糙。 为此，我找到了一款不错的截图软件， 准备用它，来实现更加高效率的截图。 图 / 引用 / Snipaste 截图工具 一款名为「Snipaste」的截图贴图软件， 完全免费使用，并且无广告，体积仅有 1 ......
一文解析 Pinia 和 Vuex，带你全面理解这两个 Vue 状态管理模式
https://mp.weixin.qq.com/s?__biz=MzA5MTI0ODUzNQ==&mid=2652957572&idx=1&sn=c77f7ca8550aace7714b26d6781ccca3&chksm=8bab097cbcdc806a190092a0c083f36b47f9e ......
Vue 路由router
简单案例： App.vue是核心组件，其中的<router-link>相当于a标签，to相当于href，export是暴露函数，这样某组件才能被其他组件识别到 代码： <template> <div id="app"> <img src="./assets/logo.png"> <h1>hello! ......
如何在Linux服务器上部署Vue项目
1. 在本地将Vue项目打包以项目运行在vscode为例，在调试窗口输入 npm run build待命令执行完毕之后，在项目目录下会生成dist文件夹，如下图 2. 创建一个运行文件，名字是：server.js server.js中的内容如下： const express = require('e ......
vue3源码-二、响应式原理effect的实现
effect实现 定义effect方法： export function effect(fn, options: any = {}) { // 创建响应式的effect const effect = createReactiveEffect(fn, options); // 默认会让effect先执 ......
vue3 vueRouter4 ：No match found for location with path ***
0. 采用vue+ router4 做路由导航. 首次载入控制台很干净. F5刷新后,控制台爆出警告,但点击路由正常工作. 1. 经过排查发现,是menu中使用了 <router-link> 这玩意,后来改造成 @click="router.push(ele.path)" 即可消除警告 2. 网络上 ......
响应式的 switchboard：让又大又慢的Vue/AIpine 页面爆快
我的提示： AIpine 是一个js 库，官网口号是 “一个新的轻量极javascript框架”，其实我之前也没接触过，翻译这篇文章时才注意到 官方地址： [AIpine.js]https://alpinejs.dev 下面开始是译文： 小提示： 在这篇文章中我将使用Vue/AIpine 术语 ，但 ......
针对Vue前后端分离项目的渗透思路
引言 在目前的开发环境下，越来越多的厂商选择 Vue.js 来实现前端功能的编写，且成熟的前端框架已经可以实现后端代码实现的功能，导致后端目前只负责提供 Api 接口和文档，方便前端的同时去调用。本文主要介绍如何针对这类前后端分离的网站去进行渗透测试，以及如何高效进行渗透测试成为了重点关注的问题。 ......
08-react修改state数据驱动视图UI的更新【注意和vue的区别】
// setState 修改状态 如果是直接修改页面不会改变 使用 setState 修改数据 才会驱动视图的改变 // setState 的原理：修改玩状态之后会调用 render 函数 import ReactDom from "react-dom" import { Component } f ......
Twitter 部分源代码泄露
导读 根据《纽约时报》的报道，一份法律文件显示，Twitter 称其部分源代码在网上被泄露，该公司已于上周五采取行动，它通过向托管代码的 GitHub 发送版权侵权通知，删除了被泄露的代码。 文件显示 Twitter 还要求美国加利福尼亚州北区地方法院命令 GitHub 识别共享代码的人以及下载代码 ......
vue3源码-一、响应式原理reactive的实现
reactive的实现 使用： 使用reactive()函数创建一个响应式对象。 import { reactive } from 'vue' export default { // `setup` 是一个专门用于组合式 API 的特殊钩子函数 setup() { const state = rea ......
Vue 异步通信Axios
使用Axios实现异步通信需要先导入cdn： <script src="https://unpkg.com/axios@1.4.0/dist/axios.min.js"></script>使用到的数据data.json { "name":"kuang" , "url":"https://www.bi ......
问题解决：Component name "xxx" should always be multi-word vue/multi-word-component-names
如题，原因是单个单词命名时语法检测无法通过，可以在导出组件时通过name属性给组件名加一个后缀，比如Component。 <script> export default { // 当组件名为一个单词时，语法检查是无法通过的，可以设置name的值为2个单词来规避检查。 name: 'HomeCompo ......
关于 Vue3 setup 语法糖
Vue3 setup 参考：https://juejin.cn/post/7009282373476941831#comment 新的 setup 是组件创建之前， props 被解析之后执行，是组合式 API 的入口 在 setup 中应该避免使用 this， 因为它不会找到示例。setup 的调 ......
vue 表单校验el-form-item加上v-if不触发校验
1 问题：在使用element是使用自定义表单校验，当表单校验el-form-item加上v-if不触发校验的问题 下图是自定义的表单校验 当切换为v-if为true的条件时，表单校验无法触发 解决方法：在el-form-item的v-if上加一个key值，令key=prop的值就解决了 自定义校验 ......
6.Vue中的路由
6.路由 6.1.介绍 6.1.1.vue-router vue中的一个==插件==库，专门用来实现==SPA应用==。 6.1.2.SPA应用 单页Web应用（single page web application，SPA）。 整个应用==只有==一个完整的页面。 点击页面中的导航链接不会刷新页面 ......
Vue 新建项目+基本语法
新建项目： 导入依赖： <script src="https://cdn.jsdelivr.net/npm/vue@2.5.21/dist/vue.min.js"></script> 基本语法 v-bind指令：可以动态绑定变量message <!DOCTYPE html> <html lang=" ......
vue 项目代码明明报错了，但控制台不打印错误的问题
我检查了如下几个内容： 我并没有任何地方做了try/catch 并不处理的情况。 也没有使用 app.config.errorHandler 全局错误拦截。 axios 也没有拦截响应也没有任何处理（哪怕报错的代码和请求无关） 哪怕手动输出 throw new Error(e.message) 也不 ......
vue2源码-十七、Vue组件间传值的方式及之间区别
Vue组件间传值的方式及之间区别 通过props传递：父组件传递数据给子组件 使用 // chilid,vue props:{ // 字符串形式 name:String // 接收的类型参数 // 对象形式 age:{ type:Number, // 接收的类型为数值 defaule:18, // ......
Vue实战案例
Vue项目案例 结合之前学习的 vue.js、脚手架、vuex、vue-router、axios、elementui 等知识点，来开发前端项目案例（仅前端不含后端）。 1.项目搭建 其实就是将我们项目需要用到的组件都安装并配置好，需要做的事有： 创建项目 & 运行项目 vue create 项目名称 ......
Vue——renderMixin【十八】
前言 经过lifecycleMixin再接下来就到了renderMixin，接下来咱们就看看renderMixin中到底有什么； 内容 renderMixin位于src/core/instance/render.ts下； export function renderMixin(Vue: typeof ......
vue3 ts 网易云信 未读数 手动设置已读已废弃
vue3 ts 网易云信 未读数 //未读数清空 $uikit.resetSessionUnread(store.sessionId.value); 调用接口nim.resetSessionUnread('sessionId')重置会话未读数。将此会话未读数置为0，之后收到消息重新计算未读数。 调用 ......
vue3 + ts + vite 封装 request
npm i axios 目录 request.ts (直接复制可用) import axios from "axios"; import { showMessage } from "./status"; // 引入状态码文件 import { ElMessage } from "element-pl ......
Vue项目如何配置、切换主题颜色（mixin + scss方式，简单高效）
Action一. 首先，引入scss依赖（node-sass, sass-loader)npm install node-sass sass-loader --save-dev1二.项目样式文件目录介绍1.此处我将项目中的公共样式文件放到了 src/style目录下，其中 index.scss是以供 ......
vue3 获取asset文件夹下所有资源文件列表
import path from "path"; const getLayerBgs = function () { const imgs: any = []; // 获取所有背景图层 //读取文件的路径 是否遍历文件的子目录 匹配文件正则表达式 const files = require.cont ......
vue3自定义指令实现el-select下拉加载更多
1. 新建js文件 export default (app) => { app.directive('loadmore', { beforeMount(el, binding) { const element = el.querySelector('.t-select__dropdown'); el ......
Django Rest Framework(DRF) + Vue + ElementPlus搭建Blog例子代码
重新用Django Rest Framework(DRF),Vue3、Pinia、Element-Plus、Axios重新改写了前面的Blog的例子. 代码放在Github上了https://github.com/magicduan/django-drf-vue/releases 这里终结一下这次改 ......
Vue2.0和3.0区别
一、项目初始化 2.0初始化，vue init <模板名称（webpack比较常用）> [项目名称] vue init webpack cli2-test 3.0初始化，vue create [项目名称] vue create cli3-test 二、目录结构对比 2.0目录结构 3.0目录结构 3 ......