export default 和 new vue（）

最新推荐文章于 2023-07-21 18:28:32 发布
最新推荐文章于 2023-07-21 18:28:32 发布
阅读量808 收藏 2
点赞数 1
分类专栏： Vue 文章标签： export default  和 new vue（）
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Ada_lake/article/details/102660440
版权

在看vue-router相关的知识点时，看到了 export default 。细细品味一下，发现其实自己不太理解 export default。
那么 export default 是什么意思呢？
export default 看单词意思就是 默认输出，默认导出的意思

其实就是复用组件的一个过程。仍然以刚刚看的 vue-router 为例进行解释。
既然vue-router中我创建了一个router组件对所有的理由进行管理。那么创建好后，就需要有人使用它。
因此我就定义一个输出接口，可以为外界调用
而使用者在使用的时候，就要先导入，再进行使用（挂载到实例上）。具体过程如图
在这里插入图片描述

有夏无夏
关注
  • 1
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
Vue的export、export default、import
u014228767的博客
12-09 1398
重点： 1）ES6模块主要有两个功能：export和import 2）在一个文件或模块中，export、import可以有多个，export default仅有一个 3）export读作 xport 意思是输出；import读作mport 意思是输入 4）输出 var a=1; var b=c; function add(x,y){ return x+y; } //输出可写作 export{ a, b, add } 也可写作 export {a} export {.
VUE中的export与export default
jing_jing95的博客
10-10 1445
1.export与export default均可用于导出常量、函数、文件、模块等 export 用来导出模块，Vue 的单文件组件通常需要导出一个对象，这个对象是 Vue 实例的选项对象，以便于在其它地方可以使用 import 引入。而 new Vue() 相当于一个构造函数，在入口文件 main.js 构造根组件的同时，如果根组件还包含其它子组件，那么 Vue 会通过引入的选项对象构造其对应的 Vue 实例，最终形成一棵组件树。 2.你可以在其它文件或模块中通过import+(常量 | 函数 |
vue的export default和new vue（{}）
晨曦的博客
12-05 1万+
最近看了些vue，查了一些资料才明白export default 是什么意思。。。     对于export defalut 在是输出，在vue里面的用法是用来输出组件，相当于把接口暴露在外部，共所有文件用import来调用，   而new vue（{}）是创建一个vue实例化，对组件进行数据操作
Vue中export default{}和new Vue()的区别
Kwoky的博客
12-11 3508
新手常常会被位于不同文件的 new Vue() 和 export default{} 搞得晕头转向。 Vue 就是一个构造函数，new Vue({})生成的实例是一个巨大的对象，可以包含数据、模板、挂载元素、方法、生命周期钩子等选项。所以渲染的时候，可以使用构造 Vue 实例的方式来渲染相应的 html 页面： new Vue({ el: '#app' ... }) 在Jav...
Vue-router(路由最优写法，路由守卫)
qq_52151772的博客
03-31 1308
最优写法
7.关于Vue vue-router 路由 的讲解（模块化的跳转地址）
qq_52252193的博客
12-17 1401
提示 大写C 和ctrl 终止vue的运行 7.1什么是 vue-router Vue Router 是Vue.js官方的路由管理器。它和 Vue.js 的核心深度集成，让构建单页面应用变得易如反掌。路由实际上就是可以理解为指向，就是我在页面上点击一个按钮需要跳转到对应的页面，这就是路由跳转；(相当于后端的转发页面，写超链接请求）中文文档：Vue Router route：首先它是个单数，译为路由，即我们可以理解为单个路由或者某一个路由； routes：它是个复数，...
Vue-Router
weixin_51186587的博客
07-28 811
1.什么是路由 1.认识路由 路由是通过互联的网络把信息从源地址传输到目的地址的活动 路由器提供了两种机制：路由和转送 路由是决定数据包从来源到目的地的路径 转送将输入端的数据转移到合适的输出端 路由表本质上是一个映射表，决定了数据包的指向 2.前端渲染和后端渲染(理解) ①后端渲染 jsp：java server page 又称为服务器渲染 html+css+java，java代码作用是从数据库中读取数据，并且将它动态的放在页面中 ②前端渲染 浏览器中显示的网页中的大部分内容，都是由前端写的js
Vue Router教程【超级详细】
weixin_46769087的博客
07-21 680
用 Vue.js + Vue Router 创建单页应用，感觉很自然：使用 Vue.js ，我们已经可以通过组合组件来组成应用程序，当你要把 Vue Router 添加进来，我们需要做的是，将组件 (components) 映射到路由 (routes)，然后告诉 Vue Router 在哪里渲染它们。
html中使用vue和echarts
最新发布
02-20
export default { data() { return { chartInstance: null, options: {/* ECharts配置项 */} } }, mounted() { this.initChart() }, methods: { initChart() { this.chartInstance = ECharts.init(this....
Vue中打印所必备资源！Bolo_Export2Excel
07-13
Bolo_Export2Excel"是一个针对此类需求的解决方案，它包含两个核心文件：Export2Excel.js和Blob.js。 首先，`Export2Excel.js`是实现数据导出到Excel的核心脚本。这个文件通常封装了将JSON数据转换成Excel格式的...
vue 组件 全局注册和局部注册的实现
08-27
export default { props: ['navTabs'], components: { 'tab-title': { props: ['info'], template: '$emit(\'addactive\')">{{info}}</li>' } } } ``` 在上面的示例中，我们使用 `v-bind` 指令将父组件的 `...
vue底部图标和页面切换
05-30
export default new Router({ routes: [ { path: '/', redirect: '/home' }, { path: '/home', component: Home }, { path: '/category', component: Category }, { path: '/cart', component: Cart }, { path...
Blob.js 和Export2Excel.js
12-11
而当我们需要在Vue项目中处理数据导出，特别是导出到Excel格式时，`Blob.js`和`Export2Excel.js`两个库就显得尤为重要。这两个库帮助开发者能够方便地将前端数据转换为Excel文件，供用户下载。 `Blob.js` 是一个...
vue-router配置和使用
庭落
09-20 857
创建跳转组件，并在main.js中引入 配置动态路由 const routes = [ { path: '/home' , component: Home } { path: '/news' , component: News } { path: '/content' , component: Content } { path: '*', redirect: 'home'} //默认跳转 ...
vue的Router相关配置
web修理工
06-04 104
import Vue from 'vue' import Router from 'vue-router' // import HelloWorld from '@/components/HelloWorld' Vue.use(Router) export default new Router({ routes: [ // {path: '/',name: 'HelloWorld',component: HelloWorld } {path:'/',name:'index',com
vue-router路由加载两种模式
不忘编码
03-29 771
路由安装 npm install --save vue-router 安装完成后，打开package.json，如果看到这个"vue-router": 版本号, 就代表安装成功了 "dependencies": { "axios": "^0.18.0", "vue": "^2.5.2", "vue-router": "^3.0.1", "vuex": "...
Vue-router的安装使用详细讲解
m0_57135756的博客
09-21 1472
特别注意:路由携带params参数时,若使用to的对象写法,则不能使用path的路径写法配置,必须使用name配置!跳转
Vue学习笔记——Vue-router
热门推荐
Stephen-James
02-24 2万+
第1节：Vue-router入门 1、解读router/index.js文件 import Vue from 'vue' //引入Vue import Router from 'vue-router' //引入vue-router import Hello from '@/components/Hello' //引入根目录下的Hello.vue组件 Vue.use(Route...
vue-router
Ada_lake的博客
10-20 6365
vue-router是什么 vue-router有哪几种方法 怎么只用vue-router 单页面应用： 基于路由和组件 route： 一条路由 routes：一组路由 router： 管理路由 客户端中的路由： dom元素显示或者隐藏。==》基于hash和基于HTML5 history api vue-router 实现vue组件之间交互 --》 会被解析为 a href ⇒ 为什么不直...
export default和new vue用法
03-16
在Vue中，我们可以使用export default来导出一个Vue组件，例如： ``` <h1>{{ message }} export default { data() { return { message: 'Hello, Vue!' } } } ``` 这个组件可以在其他Vue组件中通过...
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值