06 2021 档案

690 vue3源码:虚拟DOM,Compiler,Runtime,Reactivity,Mini-Vue,Proxy,createApp,挂载根组件,组件的始化,Compile,Block Tree
该文被密码保护。

posted @ 2021-06-30 13:49 冲啊! 阅读(0) 评论(0) 推荐(0)

689 vue3自定义指令,Teleport组件,插件编写,nexttick
摘要:认识自定义指令 实现方式一:聚焦的默认实现 实现方式二:局部自定义指令 方式三:自定义全局指令 指令的生命周期 指令的参数和修饰符 自定义指令练习 时间格式化指令 main.js import { createApp } from 'vue' import App from './04_telepo 阅读全文

posted @ 2021-06-26 10:12 冲啊! 阅读(350) 评论(0) 推荐(0)

688 vue3 Composition API:生命周期,provide,inject,hooks,render,h函数,jsx
摘要:生命周期钩子 App.vue <template> <div> <button @click="increment">{{ counter }}</button> </div> </template> <script> import { onMounted, onUpdated, onUnmount 阅读全文

posted @ 2021-06-22 21:29 冲啊! 阅读(318) 评论(0) 推荐(0)

687 vue3 Composition API:computed,watchEffect,watch
摘要:computed 01_computed的使用.vue <template> <div> <h2>{{ fullName }}</h2> <button @click="changeName">修改firstName</button> </div> </template> <script> impo 阅读全文

posted @ 2021-06-22 17:37 冲啊! 阅读(145) 评论(0) 推荐(0)

686 vue3 Composition API:setup的this、参数、返回值,reactive ,ref,readonly,toRefs,toRef,shallowRef
摘要:Options API的弊端 大组件的逻辑分散 认识Composition API setup函数的参数 setup函数的返回值 setup不可以使用this App.vue <template> <div> <home message="hahahaha" id="aaa" class="bbbb 阅读全文

posted @ 2021-06-18 22:21 冲啊! 阅读(305) 评论(0) 推荐(0)

685 vue3 mixin,extends
摘要:认识Mixin Mixin的基本使用 Mixin的合并规则 全局混入Mixin extends import { createApp } from 'vue'; import App from './01_mixin和extends/App.vue'; // import App from './0 阅读全文

posted @ 2021-06-18 16:27 冲啊! 阅读(892) 评论(0) 推荐(0)

684 Vue3过渡、动画:transition,transition-group,过渡动画class,animate.css,gsap,列表的过渡
摘要:认识动画 Vue的transition动画 Transition组件的原理 过渡动画class class添加的时机和命名规则 过渡css动画 同时设置过渡和动画 显示的指定动画时间 过渡的模式mode 动态组件的切换 appear初次渲染 01_过渡动画的使用.vue <template> <di 阅读全文

posted @ 2021-06-12 21:02 冲啊! 阅读(758) 评论(0) 推荐(0)

683 vue3的动态组件,keep-alive,异步组件和Suspense,$refs,$parent和$root,生命周期,组件的v-model
摘要:切换组件案例 v-if显示不同的组件 动态组件的实现 动态组件的传值 认识keep-alive keep-alive属性 缓存组件的生命周期 App.vue <template> <div> <button v-for="item in tabs" :key="item" @click="itemC 阅读全文

posted @ 2021-06-12 18:40 冲啊! 阅读(389) 评论(0) 推荐(0)

682 vue3非父子组件的通信之插槽Slot:多个插槽,具名插槽,动态插槽名,渲染作用域
摘要:认识插槽Slot 如何使用插槽slot? 插槽的基本使用 插槽的默认内容 多个插槽的效果 App.vue <template> <div> <my-slot-cpn> <button>我是按钮</button> </my-slot-cpn> <my-slot-cpn> 我是普通的文本 </my-sl 阅读全文

posted @ 2021-06-10 14:02 冲啊! 阅读(1292) 评论(0) 推荐(0)

681 vue3非父子组件的通信:Provide、Inject,Mitt
摘要:非父子组件的通信 Provide和Inject Provide和Inject基本使用 Provide和Inject函数的写法 处理响应式数据 A pp.vue <template> <div> <home></home> <button @click="addName">+name</button> 阅读全文

posted @ 2021-06-10 11:41 冲啊! 阅读(319) 评论(0) 推荐(0)

680 vue3组件的通信:过props,$emit,非Prop的Attribute
摘要:组件的通信 父子组件之间通信的方式 父组件传递给子组件 Props的数组用法 Props的对象用法 细节一:type的类型都可以是哪些呢? 细节二:对象类型的其他写法 细节三:Prop 的大小写命名 非Prop的Attribute 禁用Attribute继承和多根节点 App.vue <templa 阅读全文

posted @ 2021-06-06 14:59 冲啊! 阅读(151) 评论(0) 推荐(0)

679 vue3组件的拆分和嵌套,组件的css作用域
摘要:认识组件的嵌套 组件的拆分 App.vue <template> <div> <Header></Header> <MyMain></MyMain> <Myooter></Myooter> </div> </template> <script> import Header from './Heade 阅读全文

posted @ 2021-06-05 11:50 冲啊! 阅读(387) 评论(0) 推荐(0)

678 Vue CLI,vite
摘要:Vue CLI脚手架 Vue CLI 安装和使用 npm install @vue/cli -g vue create 项目的过程 项目的目录结构 认识Vite Vite的构造 浏览器原生支持模块化 Vite的安装和使用 npm install vite –g # 全局安装 npm install 阅读全文

posted @ 2021-06-04 20:50 冲啊! 阅读(116) 评论(0) 推荐(0)

导航