本文是《vue.js》系列文章第 1篇 (共 3 篇)在动态组件上使用 keep-alive我们之前曾经在一个多标签的界面中使用 is 特性来切换不同的组件:当在这些组件之间切换的时候,你有时会想保持这些组件的状态,以避免反复重渲染导致的性能问题。例如我们来展开说一说这个多标签界面:PostsArchiveCat IpsumHipster IpsumCupcake I
转载
2024-06-06 20:17:09
131阅读
笔记欢迎来到like 天的博客前端JAVA合理的创建标题,有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能,丰富你的文章UML 图表FLowchart流程图导出与导入导出导入 欢迎来到like 天的博客前端这是自
转载
2024-01-28 01:27:39
51阅读
请求html文件,得到后,将二进制文件解码为文本文件。将文本文件转化为token文件,每个token都有自己的属性值,而后将token转化为节点对象,再将这些节点对象连接在一起,构成dom树。dom是浏览器自己的语言。html文件可以部分解析,在html文件解析过程中。头部遇见css文件链接时,请求下载css文件到本地。而后二进制->文本->token->cssom。由dom和c
转载
2023-06-19 17:28:49
140阅读
全部章节 >>>>文章目录一、v-for指令1、v-for指令使用2、实践练习(待更新)二、计算属性1
原创
2021-07-01 14:04:55
56阅读
全部章节 >>>>文章目录一、v-for指令1、v-for指令使用2、实践练习(待更新)二、计算属性1、计算属性创建和使用2、实践练习(待更新)三、侦听属性1、侦听属性创建和使用2、实践练习(待更新)四、综合案例1、商品信息管理2、 实践练习(待更新)总结
一、v-for指令
1、v-for指令使用
v-for指令基于一个数组来重复渲染元素。
v-fo
原创
2022-01-24 16:04:13
134阅读
前言在 Vue 核心中除了响应式原理外,视图渲染也是重中之重。我们都知道每次更新数据,都会走视图渲染的逻辑,而这当中牵扯的逻辑也是十分繁琐。本文主要解析的是初始化视图渲染流程,你将会了解到从挂载组件开始,Vue 是如何构建 VNode,又是如何将 VNode 转为真实节点并挂载到页面。挂载组件($mount)Vue 是一个构造函
转载
2023-10-14 07:12:09
195阅读
浏览器渲染原理我们很容易将浏览器引擎看作是一个黑盒子,就像电视数据一样,黑盒子会指出显示的数据。那么浏览器是怎么把资源/数据转换到我们所看到的网页的呢 1.1 构建对象模型HTML描述了网页的结构。为了理解HTML,浏览器引擎首先必须将其转换为DOM(文档对象模型)。浏览器引擎中拥有解析器,它用于将HTML中的数据转换为DOM浏览器逐个构建DOM,只要第一行代码进来,他就开始解析HTML,向树结
1. import JsonViewer from 'vue-json-viewer' 只可以读: 案例: <div style=" width: 1000px; margin: auto; margin-top: 35px;"> <json-viewer v-model="form.headers
原创
2022-09-20 12:03:01
833阅读
浏览器渲染的工作流程浏览器的工作原理。以Webkit引擎的工作流程为例,浏览器加载一个HTML页面后进行如下操作 解析HTML【遇到<img>标签加载图片】 —> 构建DOM树加载样式 —> 解析样式【遇到背景图片链接不加载】 —> 构建样式规则树 加载javascript —> 执行javascript代码把DOM树和样式规则树匹配构建渲染树【加载渲染树
转载
2023-07-26 12:07:34
133阅读
一、条件渲染1、v-if 和v-else 条件渲染就是,通过改变条件来决定一些东西是否出现在页面中。如v-if和v-else,此要成对出现,且放在同级别标签中。如下例子,当v-if为true时,页面显示hello world 。当v-if为false时,则显示 你好 世界。<p v-if="isShow">hello world<
转载
2024-03-19 08:46:14
253阅读
备注:vue.3.0的生命周期与渲染等机制有变化,这里仅是适用vue2.0一、vue2.0生命周期beforeCreate(创建前)、created(创建后) beforeMount(载入前)、mounted(载入后) beforeUpdate(更新前)、updated(更新后) beforeDestroy(销毁前)、destroyed(销毁后)二、问题: 1.vue第一次页面加载会触发四个钩子函
转载
2024-02-28 08:33:12
200阅读
## 实现 Egg.js Docker
### 简介
在本篇文章中,我将教会你如何使用 Docker 来部署和运行 Egg.js 应用程序。Docker 是一个开源的容器化平台,可以帮助我们将应用程序和其依赖项打包到一个独立、可移植的容器中,从而实现快速、轻松地部署应用程序的目的。
### 整体流程
下面是实现 Egg.js Docker 的整体流程,以表格形式展示:
| 步骤 | 描述
原创
2023-11-05 08:50:52
58阅读
一、前端渲染访问网页时,先请求到 html 内容,并渲染出来。然后根据需要发送 ajax 请求获取后台返回的数据来更新页面。浏览器中显示的网页中的大部分内容,都是由前端写的 js 代码在浏览器中执行,最终渲染出来的网页。后端返回json数据后,前端预先写好html模板,循环读取json数据,字符串拼接,并插入页面中。(注:使用es6的模板字符串拼接能够减少拼接字符串的时间)首先、简单的介绍一下什么
转载
2023-07-18 15:45:42
138阅读
条件渲染有时候我们要根据数据的情况,决定标签是否进行显示或者有其他动作。最常见的就是,表格渲染的时候,如果表格没有数据,就显示无数据。如果有数据就显示表格数据。 Vue 帮我们提供了一个v-if的指令,帮助我们完成判断的模板处理。 <div id="app">
<h1 v-if="ok">Yes</h1>
<h1 v-else>No<
转载
2024-04-16 14:59:45
145阅读
Vue 是一套用于构建用户界面的渐进式框架,是MVVM模型,它包括声明式渲染、组件系统、客户端路由、状态管理、构建体系,我们可以根据自己的需求来应用其中的功能。在Vue的基础语法中,渲染的方式有条件渲染、列表渲染。1.条件渲染 用Vue进行条件渲染可以使用v-if和v-show指令,它们都是用于渲染某一部分内容,因为它们的渲染是需要满足条件才能
转载
2024-01-11 09:01:28
95阅读
在工作中,有次遇到要把返回的字符串分割成两部分,一部分用另外的样式显示。
这时候,我想通过对得到字符串进行处理,在需要特别样式的字符串片段用html标签(用的span)包裹起来再通过变量绑定就好了。不过此时绑定变量的vue指令要用v-html。测试方案的过程很顺利。不过后面单独为自动添加的标签(span)设定需要的css样式时(直接在vue单页面的css区域加的样式),并没有起作用,浏览器检查元素
转载
2024-02-04 11:08:37
72阅读
前言在做大屏的时候,遇到的一个小的需求:两个按钮,要求鼠标悬停一个按钮,动态显示一个组件示例的成图是这样的 当然,实际的大屏不是这样的,另一个图也是一个热力图,但是现在接口还没写完,所以先拿这个例子展示了做法动态渲染组件其实我个人知道的有两种方式v-if以及is属性但是我更推荐大家用is属性,配合component标签来达到效果,废话不多说 上教学,我们要有三个东西component标签,在这里是
转载
2024-04-18 08:43:35
189阅读
项目背景这个是我个人博客下一步开发的流程,上一篇博客讲过,我会研究eggjs后端框架,给我的博客建立后端系统。这里有人会说前端不需要学后端。怎么说呢,nodejs也是js,并且像阿里等大公司,别人虽然也用nginx之类,但是前端项目已经不是放在nginx上面跑了,所以,前端开发需要熟悉在nodejs环境下运行和开发。项目已经上传git地址:https://github.com/ht-sauce/d
转载
2024-05-11 20:58:43
113阅读
文章目录第一季内容技术梳理与架构1.springcloud五大神兽2.架构图3.springcloud后续技术 第一季内容技术梳理与架构1、整套开发技术栈以SrpingCloud为主,单个微服务模块以SpringMVC+SpringBoot/Spring+MyBatis组合进行开发。 2、前端层,页面H5+thymeleaf/样式CSS3+Bootstrap/前端框架JQuery+Node|Vu
转载
2024-10-04 08:39:03
28阅读
1.后端路由阶段 后端处理URL和页面之间的映射关系 发送URL地址给后端,后端java代码从数据库中读取数据,在后端服务器产生渲染好的HTML页面返回客户端展示。 页面中既有CSS又有php还有java,比较杂乱。 2.前后端分离阶段 由HTML+CSS+JS组成,后端只负责提供数据,1.url到 ...
转载
2021-06-24 00:16:00
740阅读
2评论