摘要：
前面章节，我们学过了父传子、子传父、祖传孙等，这些方法都是在组件树中进行数据的传递和管理，如果要在兄弟之间，或者远亲关系的组件之间进行数据的传递，利用之前的知识点，会是一件相当棘手的事情。 这个时候，如果我们跳出组件树，独立于组件树之外，创建一个用来存储数据的对象（称它为存储库），组件树中的所有组件 阅读全文
posted @ 2022-08-01 15:18
functionMC
阅读(423)
评论(0)
推荐(0)
摘要：
状态是什么？首次接触这个概念时，很多人会懵，数据是状态吗？ 状态，应该从面向对象的角度来理解。比如我们在介绍一个具体的人时，会说“他叫小明，今年18岁”，“他”是一个具体的对象，有“姓名”和“年龄”两个属性，而“姓名=小明，年龄=18”，就是“他”这个对象的状态。你说，状态就是数据，也不能说你错，但 阅读全文
posted @ 2022-06-23 17:48
functionMC
阅读(377)
评论(0)
推荐(1)
摘要：
一、Vue的组件生命周期，理解和使用都比较简单，只说知识点 1、Vue的组件生命周期，总共四个过程： 组件初始化（beforeCreate/created），逻辑层数据处理 组件挂载（beforeMount/Mounted），首次渲染到视图，形成虚拟DOM 组件数据更新（beforeUpdate/u 阅读全文
posted @ 2022-06-14 22:39
functionMC
阅读(491)
评论(0)
推荐(0)
摘要：
现代前端框架的核心，是数据驱动，绝大多数时候，我们不需要直接去操作DOM，而是通过改变数据，由框架自动完成DOM的渲染。但框架还是给我们留了后门，使我们可以拿到组件的引用。Vue使用ref属性，Blazor则使用@ref指令。 1、我们先看一个Vue的简单例子，使用很简单： //父组件 <templ 阅读全文
posted @ 2022-05-23 01:24
functionMC
阅读(869)
评论(0)
推荐(0)
摘要：
一、基本理解：首次接触“生命周期”这个名词，是比较晦涩的，Vue中有生命周期钩子，而Blazor则是虚方法重写，容易蒙。所以，我尝试从初学者的角度来阐述一下。 我们在基础部分已经知道，组件有两部分组成，一是逻辑层，有数据和方法（方法本质上也是数据）；二是视图层，虽然有自定义组件，但拆到底，还是HTM 阅读全文
posted @ 2022-05-21 20:47
functionMC
阅读(1142)
评论(0)
推荐(3)
摘要：
基础部分完结撒花！！！ 1、通过对比学习，Vue和Blazor的相似性很大，或者说现代前端框架的底层逻辑都基本一致（DOM差量更新、响应式、组件化等），实现上有各自的想法，但很多也都是相互借鉴融合。 2、虽然实际开发中，我们都是直接上各种功能丰富的组件库，大多数时候，我们都不需要去关心组件的内部实现 阅读全文
posted @ 2022-05-20 11:13
functionMC
阅读(1192)
评论(0)
推荐(1)
摘要：
这是基础部分的最后一章，内容比较简单，算是为基础部分来个HappyEnding。我们分三个部分来学习： 表单输入绑定 Vue的表单验证：VeeValidate Blazor的表单验证：EditForm 一、表单输入绑定 表单输入主要涉及前面章节的双向绑定，但不需要我们自定义，直接使用就行。如果已经掌 阅读全文
posted @ 2022-05-19 22:32
functionMC
阅读(1072)
评论(0)
推荐(1)
摘要：
Vue和Blazor的组件都有key属性，两者的作用和原理基本一致，语法上有一点点差异，如下所示 //Vue中使用key //key在ul上绑定，使用v-bind指令（简写为冒号） <ul v-for=”people in peoples” :key=”people.id”> <li>{{peopl 阅读全文
posted @ 2022-05-17 14:43
functionMC
阅读(407)
评论(0)
推荐(0)
摘要：
组件开发模式，带来了复用、灵活、性能等优势，但也增加了组件之间数据传递的繁杂。不像传统的页面开发模式，一个ViewModel搞定整个页面数据。 组件之间的数据传递，是学习组件开发，必须要攻克的难关。这个章节，我们将一起学习如何将UI片断传递给子组件。子组件的UI片断，由父组件来提供，子组件接收到后直 阅读全文
posted @ 2022-05-16 21:34
functionMC
阅读(1128)
评论(1)
推荐(6)
摘要：
1、Vue的动态组件为component，有一个is属性，通过控制is属性来完成组件的动态切换。组件切换时，被切走的组件被销毁，状态无法保存。可以结合KeepAlive，实现状态的保存。 <template> <button @click="()=>isTab1 = !isTab1">切换组件</b 阅读全文
posted @ 2022-05-13 22:14
functionMC
阅读(738)
评论(1)
推荐(1)
浙公网安备 33010602011771号