vue3.0全局API的一些修改

最新推荐文章于 2024-04-08 08:05:13 发布
最新推荐文章于 2024-04-08 08:05:13 发布
阅读量294 收藏 1
点赞数
分类专栏： Vue3.0的学习
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_49203377/article/details/119759445
版权

在这里插入图片描述
回顾一下vue2.0的写法：
从vue中导出了一个全局的对象Vue，然后上面进行一系列的配置一系列方法，然后再新建vue实例，然后再调用$mount方法把它挂载到一个DOM节点上。
在这里插入图片描述

我们发现vue2.0的全局配置在一定程度上修改了vue对象的一系列属性或者全局状态，比如一系列操作或者配置，都是直接对vue这个对象进行操作，在一定程度上会有一些问题
在这里插入图片描述
为了解决这个问题，vue3.0就推出了一个新的方法：createApp,第一个参数是你要挂载的根组件，生成一个app的实例，现在再设置任何的配置是在app的实例上，不会再向vue2.0中那样发生冲突，配置好以后再使用app上的mount方法挂载到固定的DOM节点上去
在这里插入图片描述
这就是全局API的大体修改，最终是为了解决直接修改vue对象带来的冲突问题，现在一个app的实例暴露了一系列的方法和实例，这也就是Vue3.0全局API的修改，基本规则就是任何修改全局vue对象的行为，现在都被移动到了app的实例上去，这些修改可以归纳为这么几类：
在这里插入图片描述
在这里插入图片描述在这里插入图片描述
vue3.0对一些不修改行为的API采用了es6 module的格式，并且把这些全局API改成一些具名的导出，就是为了打包的代码享受Treeshaking的优化，从而缩小代码的体积
在这里插入图片描述

weixin_49203377
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
Vue3 - 全局 API（相比 Vue2 有什么变化？具体怎么使用？）
王佳斌
11-14 679
vue3.js官方文档，Vue3 常用全局API，Vue3全局APi解析，Vue3 全局 API 的修改，Vue3如何创建全局自定义指令？Vue3如何创建全局自定义组件？Vue3如何做全局方法，vue3.0 全局API的变化，vue3.x中的全局API变化，Vue3 组合式 API，Vue3自定义全局事件，Vue3 - 全局 API（相比 Vue2 有什么变化？具体怎么使用？）
Vue3中的一些改变
李公子的博客
08-22 304
全局API的转移 Vue 2.x 有许多全局 API 和配置。 例如：注册全局组件、注册全局指令等。 //注册全局组件 Vue.component('MyButton', { data: () => ({ count: 0 }), template: '<button @click="count++">Clicked {{ count }} times.</button>' }) //注册全局指令 Vue.directive('fo
Vue3设计思路 -- 实现简单的createApp工厂函数
最新发布
2301_79055083的博客
04-08 771
技术是没有终点的，也是学不完的，最重要的是活着、不秃。零基础入门的时候看书还是看视频，我觉得成年人，何必做选择题呢，两个都要。喜欢看书就看书，喜欢看视频就看视频。最重要的是在自学的过程中，一定不要眼高手低，要实战，把学到的技术投入到项目当中，解决问题，之后进一步锤炼自己的技术。技术学到手后，就要开始准备面试了，找工作的时候一定要好好准备简历，毕竟简历是找工作的敲门砖，还有就是要多做面试题，复习巩固。有需要面试题资料的朋友点击这里可以领取。，喜欢看视频就看视频。
源码浅析-Vue3中的13个全局Api
我本可以容忍阳光，如果我不曾见过太阳，然而阳光已使我荒凉，成为更新的荒凉。
07-14 483
点击上方前端瓶子君，关注公众号回复算法，加入前端编程面试算法每日一题群本文章共5314字，预计阅读时间5-15分钟。前言不知不觉Vue-next[1]的版本已经来到了3.1.2，最近对照...
Vue3全局API
qq_53642101的博客
12-22 1054
创建一个应用实例第一个参数是根组件。第二个参数可选，他是要传递给根组件的props。
vue 更改连接后台的api
让优秀成为一种习惯
08-01 3183
vue 更改连接后台的api，是更改在config文件夹下的index.js文件中的proxyTable的值。
vue3.0 vue-quill-editor.rar
09-19
Vue3.0是Vue.js框架的重大更新，带来了许多性能优化和功能增强，旨在提供更高效、更灵活的开发体验。这次升级引入了Composition API，它允许开发者以更模块化的方式组织组件逻辑，使得代码更易于理解和维护。Vue3.0...
Vue 3.0 全家桶抢先体验
10-15
首先，Vue 3.0的核心变化之一是引入了Composition API，这是一种更加模块化和灵活的方式来组织组件逻辑。相比Vue 2.x中的Options API，Composition API允许开发者更自由地组合功能，提高代码复用性和可维护性。此外...
vue 3.0学习笔记(从入门到精通)
10-07
此外，Vue 3.0还支持`setup`函数，这是一个在组件实例创建之前执行的钩子，提供了更简洁的声明式API来处理数据和响应式逻辑。Vue 3.0的模板语法、响应式系统、事件处理和组件通信等方面都有所增强，使得开发者能够...
vue3.0搭建项目文档
10-31
Vue3.0引入了一些重要的新特性，如Composition API，它提供了更好的代码组织和复用。另外，Suspense组件允许延迟加载组件，提高页面加载速度。还有 teleport，可以将内容渲染到页面的任意位置，以及优化的模板编译和...
vue3.0_后台管理系统.zip
06-24
Vue3.0 后台管理系统是一款利用最新Vue3.0框架构建的高效、简洁且具有大气界面的管理平台。这个系统充分利用Vue3.0的新特性，提供了完整的后台管理解决方案，包括数据展示、交互操作以及与服务器的数据通信等功能。 ...
Vue 3.0 全局API
2201_75866484的博客
03-20 442
Vue 2.x 有许多全局 API 和配置，这些 API 和配置可以全局改变 Vue 的行为。例如，要创建全局组件，可以使用这样的 API：类似地，使用全局指令的声明方式如下：虽然这种声明方式很方便，但它也会导致一些问题。从技术上讲，Vue 2 没有“app”的概念，我们定义的应用只是通过new Vue()创建的根 Vue 实例。从同一个 Vue 构造函数Vue.useVue.mixin为了避免这些问题，在 Vue 3 中我们引入...
Vue3 常用全局API
weixin_41897680的博客
12-06 1587
createApp 返回一个提供应用上下文的应用实例。应用实例挂载的整个组件树共享同一个上下文。 const app = createApp({}) 你可以在 createApp 之后链式调用其它方法 参数 参数1：可以接收一个根组件对象，以vue项目为例 import App from "./App.vue"; const app = createApp(App); 参数2：接收根组件的prop属性 const app = createApp(App,{name:'11'}); //App.
vue3全局api的转移
qq_41429765的博客
10-12 266
1.全局API的转移 Vue2.x有许多全局API和配置 例如：注册全局组件，注册全局指令等。 //注册全局组件 Vue.component('myButton',{ data:()=>({ count:0 }), template:'<button @click="count++'>Clicked{{count}}</button>' }) //注册全局指令 Vue.directive('focus',{ ins
13个Vue3中的全局API的源码浅析汇总整理
油墨香^-^的博客
02-17 322
不知不觉vue-next的版本已经来到了3.1.2，最近对照着源码学习vue3的全局Api，边学习边整理了下来，希望可以和大家一起进步。我们以官方定义、用法、源码浅析三个维度来一起看看它们。
vue3.0之Global API Change-全局API修改
weixin_42555053的博客
04-10 426
vue3入口文件，采用api为createApp，然后把创建出来的对象mount到Dom节点上 vue2的写法： 从vue导出了一个全局的对象，然后在上面进行了一系列的配置，比如use、mixin等一系列方法，然后再新建vue的实例，调用$mount方法挂载到Dom节点，我们发现vue2的全局配置在一定程度上修改了vue对象一系列的属性或者说是全局状态，这些操作都是对vue对象操作的，在一定程度上会有一些问题 问题一：在单元测试中，全局配置非常容易污染全局环境。 问题二：在不同的apps中，共享一份有不同
Vue3 全局 API 变更
leaf的博客
06-16 244
Vue3 全局 API 变更 全局API和配置 从技术上讲，Vue 2 没有“app”的概念，我们定义的应用只是通过 new Vue()创建的根 Vue 实例。从同一个 Vue 构造函数创建的每个根实例共享相同的全局配置 大致就是 如果创建了多个 Vue 根实例，他们也会共享Vue.use() Vue.minx() 等一些全局配置，不利于 Vue 项目的测试等一些操作 createApp 调用 createApp 返回一个应用实例 import { createApp } from 'v
Vue3中属性的设置与修改
weixin_44301987的博客
10-28 4364
在vue3中所有的数据和函数都要在setup中编写 定义变量想要实现响应式需要使用ref() 例如：let name = ref(“张三”) 改变属性需要用 点value的方式获取定义的变量在进行赋值 例如： name.value=“李四” setup(){ let name = ref("张三呢"); let age = ref(18); let job = ref({ type: "前端工程师", salary: "30k", }); fu
Vue修改url路由中的参数
weixin_43067272的博客
09-06 2876
Vue修改url路由中的参数 话不多说，直接看代码 npm i webpack-merge import merge from 'webpack-merge'; this.$router.push({ query:merge(this.$route.query,{'key':'value'}) }) 通过下载webpack-merge依赖包实现 如果key本来存在的话就是修改key的值，不存在的话就添加key这个属性，如果想替换所有的属性只要换成{}就可以。 ...
vue面试题，共54道面试题，包括答案
06-05
以下是关于Vue 3.0的一些关键知识点： 1. Vue 3.0升级至Proxy API的原因： - Vue 2.x依赖`defineProperty` API实现响应式，但该API存在局限性，只能针对单例属性设置getter和setter，对动态添加或修改对象属性的...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值