布局 页面 部分vue2

Vue 设置为history模式之后,刷新页面报404错误的解决办法

网上搜索出现很多修改前端或后端的方法试了都不行,后来在IIS中添加URL重写规则就解决了(如果没有Url重写模块,需要下载安装:rewrite_amd64_zh-CN.msi),设置重写之后会在网站前端根目录下生成一个web.config文件。所以如果嫌配置url重写麻烦的话,直接把这个web.co ......
错误 history 模式 办法 页面

一个简单案例的Vue2.0源码

本文学习vue2.0源码,主要从new Vue()时发生了什么和页面的响应式更新2个维度了解Vue.js的原理。以一个简单的vue代码为例,介绍了这个代码编译运行的流程,在流程中原始DOM的信息会被解析转换,存在不同的对象中。其中关键的对象有el、template、ast、code、render、r... ......
源码 案例 Vue2 Vue

Vue多页面和单页面的场景

开发分类 实现方式 页面性能 开发效率 用户体验 学习成本 首屏加载 SEO 单页 一个html页面 按需更新性能高 高 非常好 高 慢 差 多页 多个html页面 整页更新性能低 中等 一般 中等 快 优 场景 单页面应用 系统类网站 内部网站 文档类网站 移动端站点 多页面应用 公司官网 电商类 ......
页面 场景 Vue

打工笔记----------------------------iframe重定向让父级页面跳转

"top.location.href"是最外层的页面跳转 $.ajax({ url: URL + "SystemPrivileges/UserChangePW", data: { userName: userName, passWord: passWord, oldpwd: passWordold, ......
页面 笔记 iframe

11、层叠布局(Stack、Align、 Positioned)

Flutter Stack组件 Stack表示堆的意思,我们可以用Stack或者Stack结合Align或者Stack结合 Positiond来实现页面的定位 布局 Alignment(对齐)类是用于表示相对于父容器的对齐方式的; Alignment 类的常见用法: Alignment.topLef ......
Positioned 布局 Stack Align

C#winform学习6(部门部分)

1.部门列表显示listview 首先需要在listview中设定相关属性 打开这个 代码: private void DeptForm_Load(object sender, EventArgs e) { //初始化列表 setListView(); } /// <summary> /// 初始化 ......
部门 winform 部分

2023-11-17 c3布局最佳属性——gap==》设置元素之间的空格

css3的gap属性可以帮助你在 1、弹性布局(display:flex) 2、网格布局(display:grid) 3、多列布局(column-count或column-width) 中轻松设置元素之间的空格,而不用自己用margin或者padding逐个去设置; 该属性是row-gap and ......
空格 布局 属性 元素 之间

Vue 项目配置自动更新,自动刷新页面

今天用户反馈使用页面的时候,有时候点击没反应,排查下来,是因为发布版本的时候,用户那边没有加载最新的文导致的,然后根据思路,做了这个自动更新的功能 效果预览 http://demo.webwlx.cn/#/update 实现思路 1. 把当前版本的编译时间,通过环境变量的方式保存起来 打开 vite ......
页面 项目 Vue

前端页面的懒加载和预加载

前言 懒加载也就是延迟加载。当访问一个页面的时候,先把 img 元素或是其他元素的背景图片路径替换成一张大小为 1*1px 图片的路径(这样就只需请求一次,俗称占位图),只有当图片出现在浏览器的可视区域内时,才设置图片正真的路径,从而减轻服务器压力,避免用户等待时间过长(一般在网站图片很多的时候使用 ......
前端 页面

Vue2与Vue3响应式原理对比

前言 技术栈是 Vue 的人,在面试中难免会被问到 Vue2 和 Vue3 的相关知识点的实现原理和比较,面试官是步步紧逼,一环扣一环。 Vue2 的响应式原理是怎么样的? Vue3 的响应式原理又是怎么样的? Vue2 中是怎么监测数组的变化的? Vue3 中又是怎么监测数组的变化的? 在问完 V ......
Vue 原理 Vue2 Vue3

从输入url到页面展现发生了什么

大致是如下步骤: 根据地址栏输入的地址向 DNS(Domain Name System)查询 IP 通过 IP 向服务器发起 TCP 连接 向服务器发起请求 服务器返回请求内容 浏览器开始解析渲染页面并显示 关闭连接 一.DNS 域名解析的过程是逐级查询的 浏览器缓存: 首先会向浏览器的缓存中读取上 ......
页面 url

Vue2 keep-alive实现原理

Vue.js 内部将 DOM 节点抽象成了一个个的 VNode 节点,keep-alive 组件的缓存也是基于 VNode 节点的而不是直接存储 DOM 结构。它将满足条件(pruneCache 与 pruneCache)的组件在 cache 对象中缓存起来,在需要重新渲染的时候再将 vnode 节 ......
keep-alive 原理 alive Vue2 keep

vue2为什么只重写了7个数组方法

首先看源码 //即将要被劫持的数组 let arr = [1, 2, 3]; //先把要劫持的方法列出来 let methods = ["push", "pop", "shift", "unshift", "reverse", "sort", "splice"]; //既然要劫持原型,就要先把原型拿 ......
个数 方法 vue2 vue

created中两次数据修改,会触发几次页面更新

面试题:created 生命周期中两次修改数据,会触发几次页面更新? 一、同步的 先举个简单的同步的例子: new Vue({ el: "#app", template: `<div> <div>{{count}}</div> </div>`, data() { return { count: 1, ......
created 页面 数据

vue2.0源码简读(5. 扩展)

5.1 event 平时开发工作中,处理组件间的通讯,原生的交互,都离不开事件。对于一个组件元素,不仅仅可以绑定原生的 DOM 事件,还可以绑定自定义事件,非常灵活和方便。那么接下来从源码角度来看看它的实现原理。 为了更加直观,通过一个例子来分析它的实现: let Child = { templat ......
源码 vue2 vue

vue2.0源码简读(7. Vuex)

7.1 Vuex 初始化 这一节主要来分析 Vuex 的初始化过程,它包括安装、Store 实例化过程 2 个方面。 安装 当在代码中通过 import Vuex from 'vuex' 的时候,实际上引用的是一个对象,它的定义在 src/index.js 中: export default { S ......
源码 vue2 Vuex vue

vue2.0源码简读(4. 深入响应式原理)

4.1 响应式对象 Object.defineProperty Object.defineProperty 方法会直接在一个对象上定义一个新属性,或者修改一个对象的现有属性, 并返回这个对象,先来看一下它的语法: Object.defineProperty(obj, prop, descriptor ......
源码 原理 vue2 vue

vue2.0源码简读(6. Vue Router)

6.1 路由注册 Vue 从它的设计上就是一个渐进式 JavaScript 框架,它本身的核心是解决视图渲染的问题,其它的能力就通过插件的方式来解决。Vue-Router 就是官方维护的路由插件,在介绍它的注册实现之前,先来分析一下 Vue 通用的插件注册原理。 Vue.use Vue 提供了 Vu ......
源码 Router vue2 vue Vue

vue2.0源码简读(3. 组件化)

3.1 createComponent 在分析 createElement 的实现的时候,它最终会调用 _createElement 方法,其中有一段逻辑是对参数 tag 的判断,如果是一个普通的 html 标签,上一章的例子那样是一个普通的 div,则会实例化一个普通 VNode 节点,否则通过 ......
组件 源码 vue2 vue

vue2.0源码简读(1. 准备工作)

1.1 认识 Flow Flow 是 facebook 出品的 JavaScript 静态类型检查工具。Vue.js 的源码利用了 Flow 做了静态类型检查,所以了解 Flow 有助于阅读源码。 为什么用 Flow JavaScript 是动态类型语言,它的灵活性有目共睹,但是过于灵活的副作用是很 ......
源码 vue2 vue

vue2.0源码简读(2. 数据驱动)

2.1 new Vue 发生了什么 从入口代码开始分析,先来分析 new Vue 背后发生了哪些事情。new 关键字在 Javascript 语言中代表实例化是一个对象,而 Vue 实际上是一个类,类在 Javascript 中是用 Function 来实现的,来看一下源码,在 src/core/i ......
源码 数据 vue2 vue

直播平台搭建,实现自定义设置登录页面

直播平台搭建,实现自定义设置登录页面 1.在resources中建立static文件夹(默认找这里面的页面) 创建login.html <!DOCTYPE html><html xmlns:th="http://www.thymeleaf.org"><head> <meta charset="UTF ......
页面 平台

javascript postMessage给子页面发消息

发送消息页面 <!DOCTYPE html> <html> <head> <title>demo</title> <meta charset="utf-8" /> <script> var childwin const childname = "popup" function openChild() ......
postMessage javascript 消息 页面

vue+pdfh5实现将pdf渲染到页面上

版本:pdfh5@1.4.7 vue2+.net Core 6.0webapi 方法一:通过访问后端获取二进制数据来渲染 前端渲染 <template> <vol-box ref="box" :width="width" :height="height"> <div id="demo" ref="r ......
页面 pdfh5 pdfh vue pdf

将较大的数组赋值<el-table></el-table>时,会导致页面卡顿,甚至崩溃

遇到的问题:将长度为40的数组数据赋值<el-table></el-table>,我发现loading没有效果,后面发现是页面卡住了,loading直接没有出现。 经过查询资料,发现<el-table>会有卡顿的问题,看到有的博主推荐使用一款叫umy-ui的插件,我就试了试,发现卡顿的问题解决了。 ......
el-table table 数组 页面 lt

10、弹性布局(Flex Expanded)

自定义的IconContainer class IconContainer extends StatelessWidget { Color color; IconData icon; // IconContainer(this.icon ,{super.key,required this.color ......
弹性 布局 Expanded Flex

vue2 项目打包后自动压缩成zip文件

安装依赖 1 pnpm install filemanager-webpack-plugin --save-dev 在vue.config.js中添加如下代码 const FileManagerPlugin = require('filemanager-webpack-plugin')//引入插件 ......
文件 项目 vue2 vue zip

9、线性布局(Row和Column)

自定义的IconContainer void main() { runApp(MaterialApp( theme: ThemeData(primarySwatch: Colors.yellow), home: Scaffold( appBar: AppBar(title: const Text(" ......
线性 布局 Column Row

使用js添加按钮,vue页面 el-calendar 添加自定义按钮

html代码: <div class="schedule"> <div class="title"> 今 日 日 程 </div> <div class="allSchedule"> <el-row class="addSchedule" type="flex" align="middle"> <e ......
按钮 el-calendar calendar 页面 vue

vue2 前后端分离的项目,用宝塔部署,出现域名访问根目录能访问,加任何网址就404

https://admin.xxx.com/ 访问正常 https://admin.xxx.com/index 访问404 location / { root /home/ruoyi/projects/ruoyi-ui; try_files $uri $uri/ /index.html; index ......
宝塔 根目录 网址 域名 项目