components/header-nav/menu-nav.vue

<template>
<div>
menu nav
</div>
</template>

components/header-nav/login-nav.vue

<template>
<div>
login nav
</div>
</template>

第一种方法:

components/header-nav/index.js

import MenuNav from "./menu-nav.vue";
import LoginNav from "./login-nav.vue"; export default {MenuNav, LoginNav}

components/header.vue

<template>
<header>
<menu-nav></menu-nav>
<login-nav></login-nav>
</header>
</template>
<script>
import MenuNav from "./header-nav;
import LoginNav from "./header-nav";
export default {
components: MenuNav,LoginNav
};
</script>

第二种方法

<template>
<header>
<menu-nav></menu-nav>
<login-nav></login-nav>
</header>
</template>
<script>
import MenuNav from "./header-nav/menu-nav.vue";
import LoginNav from "./header-nav/login-nav.vue";
export default {
components: {MenuNav,LoginNav}
};
</script>

vue: register and import的更多相关文章

  1. 在vue中使用import()来代替require.ensure()实现代码打包分离

    最近看到一种router的写法 import Vue from 'vue' import Router from 'vue-router' Vue.use(Router) const login = ...

  2. Vue 导入文件import、路径@和.的区别

    ***import: html文件中,通过script标签引入js文件.而vue中,通过import xxx from xxx路径的方式导入文件,不光可以导入js文件. from前的:“xxx”指的是 ...

  3. Element + Vue I18n动态import加载国际化语言包翻译文件

    需求 项目为多页应用,包含产品a.b.c.d.e,每个产品都有自己的翻译文件.一次加载所有翻译文件是极度不合理的.于是考虑动态加载. 实现 参考官方文档:延迟加载翻译 项目结构 │ ├── dist ...

  4. vue中的import {} from '@/api/api'

    例:import {queryDepartTreeList, searchByKeywords} from '@/api/api' 首先查看vue.config.js文件,在这个文件里面定义了定义了@ ...

  5. vue 中使用import导入 script 在线链接

    一般我们在vue中导入另外一个文件或者文件中的方法,我们都是使用import来实现他的,那么问题来了,现在我们要导入的不是另外的一个文件,而是在线链接,这该怎么办?我们也使用了 import * as ...

  6. vue中的import、export、requre的区别

    在es6之前js一直没有自己的模块语法,为了解决这种尴尬就有了require.js的出现.在es6发布之后js又引入了import的概念使得不清楚两者之间的区别的同学在实际使用过程中造成了自己的误解, ...

  7. Vue export和import

    config/index.js export default '123456'; import strs from '@/config';   //此处直接写@config就可以, 如果是export ...

  8. vue中创建js文件使用export抛出函数,import引入后不能绑定HTML的问题

    在es6中使用export和import实现模块化: js文件: export function test(x) { console.log(x); } vue组件: import {test} fr ...

  9. vue使用import来引入组件的注意事项

    Vue使用import ... from ...来导入组件,库,变量等.而from后的来源可以是js,vue,json.这个是在webpack.base.conf.js中设置的: module.exp ...

随机推荐

  1. day11(jsp入门&Cookie&HttpSession&一次性图片校验码)

    day11 JSP入门   1 JSP概述 1.1 什么是JSP JSP(Java Server Pages)是JavaWeb服务器端的动态资源.它与html页面的作用是相同的,显示数据和获取数据. ...

  2. android showDialog用法

    protected Dialog onCreateDialog(int id) { // TODO Auto-generated method stub switch(id){ case 10: re ...

  3. centos LAMP第一部分-环境搭建 Linux软件删除方式,mysql安装,apache,PHP,apache和php结合,phpinfo页面,ldd命令 第十九节课

    centos LAMP第一部分-环境搭建  Linux软件删除方式,mysql安装,apache,PHP,apache和php结合,phpinfo页面,ldd命令 第十九节课 打命令之后可以输入: e ...

  4. HDU2588:GCD(欧拉函数的应用)

    题目链接:传送门 题目需求:Given integers N and M, how many integer X satisfies 1<=X<=N and (X,N)>=M.(2& ...

  5. POJ2115:C Looooops(一元线性同余方程)

    题目: http://poj.org/problem?id=2115 要求: 会求最优解,会求这d个解,即(x+(i-1)*b/d)modm;(看最后那个博客的链接地址) 前两天用二元一次线性方程解过 ...

  6. boost pool 和 object_pool

    内存池(Memory Pool)是一种内存分配方式.        通常我们习惯直接使用new.malloc等API申请分配内存,这样做的缺点在于:由于所申请内存块的大小不定,当频繁使用时会造成大量的 ...

  7. Sql Server查询同一ID 时间较大的一条数据

  8. 使用Sed和Awk实现批量文件的文本替换

    摘要: 使用 Sed 完成文本替换操作任务是非常合适的.结合 find 命令,即可实现指定批量文件的文本替换.同时给出了Awk的解决方案作为对比. 问题 现在, 我要将一个原有Java项目中的一些包及 ...

  9. java--jvm启动的参数

    java启动参数共分为三类其一是标准参数(-),所有的JVM实现都必须实现这些参数的功能,而且向后兼容:其二是非标准参数(-X),默认jvm实现这些参数的功能,但是并不保证所有jvm实现都满足,且不保 ...

  10. 了解下Mysql的间隙锁及产生的原因

    什么是间隙锁当我们用范围条件而不是相等条件检索数据,并请求共享或排他锁时,InnoDB会给符合条件的已有数据记录的索引项加锁:对于键值在条件范围内但不存在的记录,叫做“间隙(GAP)”,InnoDB也 ...