Vue专项练习

简介: Vue专项练习

关于Vue双向数据绑定


1、Vue实现双向数据绑定是采用数据劫持和发布者-订阅者模式

2、用户更新了View,Model的数据也自动被更新,这种情况就是双向数据绑定

3、Vue3.0数据劫持是利用ES5的Object.definProperty(obj,key,val)方法来劫持每个属性的getter和setter


Vue内置组件


1、transition:为组件的载入和切换提供动画效果

2、transition-group:作为多个元素/组件的过渡效果

3、keep-alive:缓存子组件,被包裹的子组件会多出两个生命周期:actived、deactivated

4、v-model:双向绑定

5、v-on:绑定事件

6、v-bind:绑定DOM

7、v-html:渲染html


Vue动态路由


获取动态路由{path:’/name/:id’}中的id值:this.$router.params.id


Vue2和Vue3的区别


1、Vue3中的Template支持多个要标签,Vue2不支持

2、Vue3中的生命周期的挂钩是onMounted,需要引入才能使用

3、Vue3引入了tree-shaking,以模块的方式引入api,减少打包体积


Vue的特性


1、轻量级

2、双向数据绑定

3、组件化

4、数据驱动视图

相关文章
|
2天前
|
JavaScript
vue中使用@scroll不生效的问题
vue中使用@scroll不生效的问题
|
9天前
|
JavaScript 开发者
[译] 监听第三方 Vue 组件的生命周期钩子
[译] 监听第三方 Vue 组件的生命周期钩子
|
9天前
|
JavaScript 前端开发
[译] 复用 Vue 组件的 6 层手段
[译] 复用 Vue 组件的 6 层手段
|
10天前
|
JavaScript 开发者
vue学习之响应式数据绑定
响应式数据绑定
21 0
|
9天前
|
JavaScript API
vue 批量自动引入并注册组件或路由
vue 批量自动引入并注册组件或路由
|
9天前
|
缓存 监控 JavaScript
vue从安装到熟练 2022流畅无痛版(第一季:入门篇)
该文章是《vue从安装到熟练 2022流畅无痛版》系列的第一季入门篇,介绍了Vue的基本概念、环境配置、项目创建与运行,并通过修改HelloWorld.vue和App.vue文件内容展示了如何在页面上显示"Hello World",最后还提供了Vue官方文档链接和介绍了Vue的常用内置指令和模板语法等基础知识。
vue从安装到熟练 2022流畅无痛版(第一季:入门篇)
|
11天前
|
JavaScript 前端开发
vue入门
vue入门
14 2
vue入门
|
1天前
|
数据采集 JavaScript 搜索推荐
我们一起聊聊如何对Vue项目进行搜索引擎优化
【9月更文挑战第4天】Vue 项目的搜索引擎优化(SEO)较为复杂,因其内容默认由 JavaScript 渲染,部分搜索引擎难以索引。为提升 SEO 效果,可采用服务器端渲染(SSR)或预渲染,使用 Nuxt.js 或 Vue Server Renderer 实现 SSR,或利用 Prerender SPA Plugin 预渲染静态 HTML。此外,动态管理 Meta 标签、优化静态内容与 Sitemap、懒加载、图片优化、提升页面速度、设置正确的路由模式、使用结构化数据及构建良好外链均有益于 SEO。
33 11
|
5天前
|
存储 JavaScript
vue组件的五种传值方法(父子\兄弟\跨组件)
vue组件的五种传值方法(父子\兄弟\跨组件)
|
2天前
|
缓存 JavaScript 前端开发
vue中使用keep-alive的问题
vue中使用keep-alive的问题